Pull to refresh
95
Karma
0
Rating
Максим Усачёв @psywalker

Веб-разработчик

Правда ли уже пора использовать CSS Grid Layout?

Website development *CSS *HTML *
Translation

Я учусь пилотировать легкие самолеты. Это отвлекает меня от компьютеров. Недавно мне никак не удавалось удержать Сессну-150 на малой высоте, когда мы приближались к аэропорту Бристоля. Меня буквально засосало в облако восходящим потоком. Мой летный инструктор сказал: «Это не ваша вина, но ваша проблема». Он имел в виду, что я обязана была удерживать высоту, пусть даже что-то работало против меня. Мне нужно было узнать, что бывает такая ситуация, и научиться справляться с ней при пилотировании.


Уже после приземления я подумала, что фраза «это не ваша вина, но ваша проблема» отлично подходит практически к любым ситуациям. В этой статье я раскрываю тему поддержки старых браузеров при использовании новых технологий наподобие CSS Grid Layout. Мы, разработчики, часто робеем при обсуждении браузерной поддержки с заказчиками и коллегами, как будто это мы виноваты в том, что сайты не выглядят в IE9 в точности так же, как в новейших Firefox или Chrome. Пора нам уже принять, что это не наша вина. Но обязанность справиться с этим как следует, с пользой для каждого — во многом наша проблема.

Читать дальше →
Total votes 17: ↑16 and ↓1 +15
Views 29K
Comments 32

Может, хватит уже поливать грязью CSS на конференциях разработчиков?

Website development *CSS *
Translation

На почти каждой конференции разработчиков вот-вот будет доклад, в котором будет вот эта «смешная гифка»:


«смешная гифка»


Питер Гриффин из одноименного мультсериала пытается закрыть жалюзи и запутывает их напрочь, дергая за веревки как попало, пока не выходит из себя и срывает их с окна. Надпись на картинке: «CSS».


Публика всегда такое любит, и отсюда можно удачно перейти к рассказу о проблемах CSS и примерам их решения. Но в большинстве случаев — и чем более «технарская» это конференция, тем вероятнее — это начало тирады о том, какая гадость этот CSS, до чего ужасна его архитектура и как он нелогичен. И т.д., и т.п...


Читать далее
Total votes 89: ↑54 and ↓35 +19
Views 35K
Comments 240

Как называть css-классы

Website development *CSS *HTML *
Translation
Основываясь на моих любимых статьях по данной теме и личном опыте, вот мои 5 копеек о том, как называть CSS-классы.

0. Прежде чем думать о названии класса, выберите подходящее название для HTML-элементов



Если это поле, используйте элемент input

Читать HTML-документ будет гораздо легче.

Пример:

<div class='submit'/> <!-- Чёёё? -->
<input class='submit'/> <!-- Аа, ясно -->


Источник: Рафаэль Гоитер (французская статья)
Читать всю статью
Total votes 53: ↑35 and ↓18 +17
Views 137K
Comments 114

Почти полное руководство по flexbox (без самих flexbox)

Website development *CSS *HTML *
Translation
image

К сожалению, не у всех есть браузер/устройство, поддерживающие flexbox. Это руководство в виде шпаргалки, в котором предлагаются альтернативы обратной совместимости для свойств flexbox.

Хотя некоторый CSS-код в этом руководстве, возможно, покажется очевидным, я собираюсь бросить вызов flexbox, а также предложить простые решения проблем, которые возникали, пока он не обрёл популярность.

Читать всю статью
Total votes 41: ↑32 and ↓9 +23
Views 61K
Comments 59

Идеи для HTML6 или HTML.next

Website development *HTML *
Translation
image

Идея HTML6, несмотря на то, что спецификация HTML5 по плану должна была быть полностью внедрена и достичь максимальной совместимости к 2014-му, сейчас стали появляться мысли насчет того, как может выглядеть следующее поколение этой спецификации — HTML.next, как её обычно называют в консорциуме W3C.
Читать дальше →
Total votes 35: ↑28 and ↓7 +21
Views 28K
Comments 62

Цикл статей «Инлайновый контекст форматирования» в PDF-формате

Self Promo
Где-то около полугода мы с моим коллегой по цеху SelenIT2 копались в спецификациях, чтобы изучить одну из самых важных и загадочных сторон действующей спецификации CSS — визуальное форматирование текста.

Для многих не секрет, что спецификация — это лабиринт и что порой выбраться из него не так-то и просто. Поэтому периодически нам приходилось обращаться за помощью к таким гуру, как Boris Zbarsky, fantasai и не только.
Читать дальше →
Total votes 6: ↑5 and ↓1 +4
Views 1.6K
Comments 0

Новое противостояние между WHATWG и W3C: в чьих руках будущее HTML5?

Website development *HTML *
Недавно случилось одно очень судьбоносное для веба событие, на мой взгляд. Иэн Хиксон (или просто Хикси) покинул W3C и решил заняться тем, что ему ближе — вести «живой стандарт», не дожидаясь утверждения своих действий коллег из W3C. Всё бы конечно ничего, если бы не много весомых НО, из-за которых эта ситуация может обернуться для нас не лучшим образом.
Читать дальше →
Total votes 32: ↑26 and ↓6 +20
Views 1.7K
Comments 78

Кроссбраузерный <progress>-бар

Self Promo
image

Доброе время суток, Хабро-сообщество!

Совсем недавно по работе мне попалась интересная задачка, которую я всё же реализовал. Нужно было соорудить прогресс-бар, который был бы полностью универсальный, поддающийся любой стилизации и плюс ко всему кроссбраузерный (начиная c IE7+)!

Здесь привожу конечный результат. Полный вариант статьи можно найти здесь

Читать дальше →
Total votes 37: ↑21 and ↓16 +5
Views 1.2K
Comments 35

Равномерное выравнивание блоков по ширине

Self Promo
Продолжая свои «css-раскопки» возникла новая идея, разобрать по косточкам ещё одну актуальную тему, которая касается равномерного выравнивания блоков по ширине. В принципе мои доскональные исследования я уже запостил у себя в блоге, но так как прошлая моя работа очень понравились Хабра-сообществу, то я решил сделать здесь небольшой краткий обзорчик этой статьи, чтобы ни одна хабра-душа не пропустили её наверняка. Так что, как говорил Гагарин: «Поехали».

В общем в задачах вёрстки периодически возникают моменты, когда появляется необходимость выровнять какой-нибудь список по ширине экрана. При этом пункты этого списка должны выравниваться равномерно, прижимаясь своими крайними элементами к границам контейнера, а расстояние между ними должно быть одинаковым.
image
Читать дальше →
Total votes 172: ↑163 and ↓9 +154
Views 15K
Comments 87

Opera 12 (Wahoo), обновление ядра с исправлениями функции Do Not Track, почты и темизации

Self Promo
Вчера вышло очередное обновление Opera 12 (Wahoo). Список исправлений и изменений достаточно большой, но в основном все они касаются технологии Do Not Track, «оперной» почты и темизации. Норвежцы поработали на славу и последний Changelog приятно удивил.

Вышедшая сборка состоит из множества фиксов, улучшений и изменений.
Читать дальше →
Total votes 53: ↑44 and ↓9 +35
Views 461
Comments 54

«Загадочные отступы» между инлайн-элементами

Self Promo
Каждому, даже самому «молодому» верстальщику известны неприятности (проблемы) с интервалом между элементами, пробелами, которые вставляются между словами. Эти пробелы часто мешают нам при вёрстке того или иного блока. Избавиться от них бывает не так-то просто, а зачастую эти межсловные расстояния и вовсе ставят нас перед выбором, выбором способа решения данной проблемы.

В этой статье мы попытаемся понять, что же из себя представляют эти загадочные "Отступы", что это за звери и с чем их едят. Так же рассмотрим, что такое inline-block, и почему после себя он ставит эти непонятные интервалы. Ну, и, самое главное, мы увидим несколько универсальных решений данного вопроса и, конечно же, обсудим все их стороны.
Читать дальше →
Total votes 127: ↑123 and ↓4 +119
Views 25K
Comments 141

Information

Rating
Does not participate
Location
Москва, Москва и Московская обл., Россия
Date of birth
Registered
Activity