CSS-live.ru

Cтатьи по тегу «прогрессивное улучшение»

Грядут гриды!

4

Перевод статьи CSS Grid! с сайта meyerweb.com для css-live.ru, автор — Эрик Мейер

Гриды к нам приходят! Гриды к нам приходят! На самом деле, наконец они появятся в ближайшем браузере! Ураааааа!

Эй, потише там. Что за тарарам?

CSS Grid начнет поддерживаться по дефолту в Chrome и Firefox в марте 2017-го. А именно, Мозилла включит его в Firefox 52, намеченном на 7 марта. Судя по тому, когда Grid включили по дефолту в Chrome Canary, похоже, что Google выпустит его с Chrome 57, намеченным на 14 марта. В обоих случаях, с тех пор как поддержку включат по дефолту в основных релизных каналах — т.е. «вечнозеленых» браузерах, которыми пользуются обычные люди — вся-вся поддержка гридов, что сейчас есть в версиях для разработчиков, станет доступна для всех. Всё гридовое Просто Начнет Работать™®©.

Эти даты железобетонно гарантированы?

Анахроничная борода: новая методология разработки сайтов для любых устройств и платформ

1

Перевод статьи Anachronistic Beard: a new methodology to make sites work anywhere с сайта brucelawson.co.uk, опубликовано на css-live.ru с разрешения автора — Брюса Лоусона.

(Пустая темная сцена. В центре — круг света от единственного прожектора. Из темноты выходит Брюс, в черной водолазке)

Ребята, вы готовы? (в зале возгласы и визги, как на презентациях Apple)

Ребята, вы ГОТОВЫ? (крики «Дааа!» и «Воистину!»)

Вы готовы к тому, что у вас ПЕРЕВЕРНУТСЯ ОСНОВЫ? (зрители массово падают в обморок от волнения)

Хотите ли вы, чтобы ваши сайты работали ВЕЗДЕ? (в зале уже не осталось ни одного сухого кресла)

Сегодня мы представляем супермегановейшую, переворачивающую основы методологию разработки под названием…

Анахроничная борода.

beard

Снова равномерное выравнивание блоков по ширине: постепенное улучшение до Flexbox

36

Задача равномерного выравнивания горизонтальных элементов (например, пунктов меню) по всей ширине контейнера стабильно остается актуальной в верстке. Два года назад Максим Усачев (psywalker) написал обстоятельнейший разбор ее решений, который заслуженно стал самой популярной статьей на CSS-live.ru. Были рассмотрены 4 варианта:

  1. Вариант с разносторонним выравниванием (на базе float), к сожалению, не способный претендовать на универсальность;
  2. Вариант с дополнительным контейнером (в принципе, работоспособное решение, но только для фиксированной ширины элементов);
  3. Вариант с text-align: justify для инлайн-блоков и дополнительным элементом-распоркой (приемлемое решение);
  4. То же самое, но с заменой элемента-распорки на псевдоэлемент :after (лучшее решение).

У двух последних решений была изюминка в виде двух малоизвестных свойств CSS3 (text-align-last и text-justify), по иронии судьбы с незапамятных времен работающих в IE (где они и появились).

Но прогресс открывает нам всё новые возможности, и у старых задач появляются новые, более простые решения. Нашлось оно и для равномерного выравнивания.