CodeBase | Frontend
2.16K subscribers
455 photos
194 videos
4 files
733 links
Все самое интересное и полезное у нас 😎

Контакт: @Filgood777 (реклама, сотрудничество)
Download Telegram
Неизвестно полезный CSS

Неважно, верстаете ли вы сайт для малого бизнеса или создаёте супермодное React приложение. Здесь собраны фишки CSS, которые пригодятся каждому. Что-то, возможно, вы уже знаете, но наверняка тут найдётся для вас что-то новенькое.

В этой подборке про вертикальный текст, clip-path, контрастность текста и не только.

Кстати, это уже 6 подборка советов, остальные вы найдёте в конце статьи.

CodeBase | Frontend | #CSS
👍62🔥2
⚙️ Что такое свойство flex-grow в CSS и зачем оно используется?

Свойство flex-grow определяет, как свободное пространство внутри контейнера делится между дочерними элементами.

Оно задаёт коэффициент роста: чем больше значение, тем больше элемент занимает места.

➡️ Пример:

<div class="container">
<div class="item item1">1</div>
<div class="item item2">2</div>
<div class="item item3">3</div>
</div>

<style>
.container {
display: flex;
width: 300px;
border: 1px solid #ccc;
}
.item {
padding: 10px;
color: white;
}
.item1 { flex-grow: 1; background: #007bff; }
.item2 { flex-grow: 2; background: #28a745; }
.item3 { flex-grow: 1; background: #dc3545; }
</style>


🗣 В этом примере у второго элемента flex-grow: 2, поэтому он занимает в два раза больше места, чем соседние блоки.

CodeBase | Frontend | #CSS
Please open Telegram to view this post
VIEW IN TELEGRAM
👍631