Size: a a a

CSS — русскоговорящее сообщество

2020 April 20

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
не была бы актуальная, я бы пост не писал
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
А впрочем, пришло время САМОПИАРА
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
как всегда
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Telegram
Будни верстальщика
Ahmad Shadeed выложил статью в которой разобрал CSS обновлённого Facebook: https://ishadeed.com/article/new-facebook-css/, есть в переводе на Хабре: https://habr.com/ru/company/ruvds/blog/496958/

Конечно, некоторая часть выложенного это, скорее, хаки, если даже не издевательство над здравым смыслом. Хорошо видно, что работают разные команды. Впрочем, хорошие дизайн-решения тоже есть.

Есть там момент, который конкретно так меня покоробил. Это укладка flexbox-сеток.

Я не знаю по какой причине они это сделали, но они решили классическую проблему space-between на недостаточном числе элементов… добавлением пустых элементов. То есть, фактически, добиванием сетки до кратного числа блоков чтобы избежать широких промежутков.

На самом же деле достаточно было либо блока, либо псевдо-элемента со следующими правилами:

.wrapper::after {
 content: ‘’;
 flex-grow: 1;
}

Грубо говоря, установить распорку.

Думаю, знать простые решения тоже необходимо. Как и уметь считать 🙂
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
и как всегда — предлагайте будущие темы, потом голосовалку может даже можно будет устроить
источник

VK

Vitaliy Kirenkov in CSS — русскоговорящее сообщество
я лайкнул еси чо -)
источник

ZA

Zahar Avsievich in CSS — русскоговорящее сообщество
Vitaliy Kirenkov
я лайкнул еси чо -)
+
источник

p

persona x grata in CSS — русскоговорящее сообщество
Можно заюзать width: calc(100% / 12 * 4 - margin)
1 элемент будет занимать 4 ячейки из 12 якобы бутстрап сетка
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Vitaliy Kirenkov
я лайкнул еси чо -)
Ах 😍
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
🥰
источник

p

persona x grata in CSS — русскоговорящее сообщество
Зашёл лайкнул, кол-во лайков уменьшилось, понял, что уже лайкал, возвратил лайк на место
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Кек )))
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
persona x grata
Зашёл лайкнул, кол-во лайков уменьшилось, понял, что уже лайкал, возвратил лайк на место
Так держать)
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Дизлайк кто-то влепил, ахаха )))
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Ну тоже ок.
источник

DS

Dmitriy Shuleshov in CSS — русскоговорящее сообщество
Sergey Bekharsky
Telegram
Будни верстальщика
Ahmad Shadeed выложил статью в которой разобрал CSS обновлённого Facebook: https://ishadeed.com/article/new-facebook-css/, есть в переводе на Хабре: https://habr.com/ru/company/ruvds/blog/496958/

Конечно, некоторая часть выложенного это, скорее, хаки, если даже не издевательство над здравым смыслом. Хорошо видно, что работают разные команды. Впрочем, хорошие дизайн-решения тоже есть.

Есть там момент, который конкретно так меня покоробил. Это укладка flexbox-сеток.

Я не знаю по какой причине они это сделали, но они решили классическую проблему space-between на недостаточном числе элементов… добавлением пустых элементов. То есть, фактически, добиванием сетки до кратного числа блоков чтобы избежать широких промежутков.

На самом же деле достаточно было либо блока, либо псевдо-элемента со следующими правилами:

.wrapper::after {
 content: ‘’;
 flex-grow: 1;
}

Грубо говоря, установить распорку.

Думаю, знать простые решения тоже необходимо. Как и уметь считать 🙂
точняк забыл за распорку) эх где мои таблицы))
источник

VK

Vitaliy Kirenkov in CSS — русскоговорящее сообщество
Sergey Bekharsky
Telegram
Будни верстальщика
Ahmad Shadeed выложил статью в которой разобрал CSS обновлённого Facebook: https://ishadeed.com/article/new-facebook-css/, есть в переводе на Хабре: https://habr.com/ru/company/ruvds/blog/496958/

Конечно, некоторая часть выложенного это, скорее, хаки, если даже не издевательство над здравым смыслом. Хорошо видно, что работают разные команды. Впрочем, хорошие дизайн-решения тоже есть.

Есть там момент, который конкретно так меня покоробил. Это укладка flexbox-сеток.

Я не знаю по какой причине они это сделали, но они решили классическую проблему space-between на недостаточном числе элементов… добавлением пустых элементов. То есть, фактически, добиванием сетки до кратного числа блоков чтобы избежать широких промежутков.

На самом же деле достаточно было либо блока, либо псевдо-элемента со следующими правилами:

.wrapper::after {
 content: ‘’;
 flex-grow: 1;
}

Грубо говоря, установить распорку.

Думаю, знать простые решения тоже необходимо. Как и уметь считать 🙂
клирфикс 21го века -)))
источник

m

mazya in CSS — русскоговорящее сообщество
Sergey Bekharsky
Дизлайк кто-то влепил, ахаха )))
Я нечаянно, не могу теперь его убрать, вылазит 'подождун'
источник

DS

Dmitriy Shuleshov in CSS — русскоговорящее сообщество
Vitaliy Kirenkov
клирфикс 21го века -)))
помнишь прозрачные гифики однопиксельные распорки)
источник

SB

Sergey Bekharsky in CSS — русскоговорящее сообщество
Dmitriy Shuleshov
помнишь прозрачные гифики однопиксельные распорки)
Ох ё
источник