Master-X
Форум | Новости | Статьи
Главная » Форум » Дизайн » 
Тема: Вопрос по вёрстке: резиновый padding
цитата
10/04/16 в 09:50
 Shoto-kan
На примере:
предположим, что разрешение экрана 1366x768
размер тумбы 320X240
стиль width: 100%; height: 100%;

Влезает 4 тумбы(1280), остаётся 86.

Вопрос: как стилем распределить поровну оставшееся место между тумбами?
Что бы padding растягивался относительно разрешения.

Обычно padding фиксированный,
а остававшееся место распределяется по краям.

Мне надо что бы расстояние между тумбами было как можно больше, но не в ущерб количеству тумб в ряд.

Предположим, что в ряд может влезть 5 тумб с padding 1 - значит путь будет так.
Но если в ряд никак не может влезть пятая тумба даже с padding 1,
то пускай будет 4 тумб, и оставшееся место растянет padding.

То есть в первую очередь количество тумб в ряд (в ущерб padding).

Возможно такое сделать?
цитата
10/04/16 в 10:42
 Quutamo
такое возможно на flexbox-е сделать
http://maxsite.org/page/flexbox
http://html5.by/blog/flexbox/
цитата
23/04/16 в 09:58
 Veronique
Если юзера с сафари побоку, то да, можно и на флексе.
цитата
23/04/16 в 18:06
 Blackout
Veronique писал:
Если юзера с сафари побоку, то да, можно и на флексе.

Всмысле? Работает там флекс.
цитата
23/04/16 в 18:45
 SAV
интересная вещица этот flex
https://www.w3.org/TR/css-flexbox-1/
https://webref.ru/css/flex
цитата
23/04/16 в 21:46
 S_Flash
flex - это типа убийца бутстрапа и подобных сеточных css фреймворков?
цитата
23/04/16 в 22:54
 Stek

Это просто что то новой возможности в стилях, которую стали поддерживать новые версии браузеров.
цитата
24/04/16 в 12:04
 S_Flash
Задачи выполняет очень похожие.
цитата
24/04/16 в 13:12
 Rukamy
да флекс, только он чето на телефонах не работает.
цитата
24/04/16 в 13:42
 S_Flash
Rukamy: Nokia?!
цитата
24/04/16 в 18:34
 Rukamy
S_Flash писал:
Rukamy: Nokia?!

Ну в моем случае айфон и андроид 4.3 почему то текст накладывался друг на друга, когда 2 колонки перестроились в одну. Не знаю почему.
цитата
24/04/16 в 19:16
 SAV
тут http://caniuse.com/#search=flex как раз указано андройд с 4.4, заметка для 4.2-4.3
цитата
26/04/16 в 01:39
 grush
начиная с ИЕ9 - вполне себе в css работает - calc()

не работает в ведроиде и иосе
но на этих девайсах мы знаем конретное разрешение экранов потому можно и железно задать нужные параметры

ну и опять же почему-бы не использовать % размерность для тумб? +/- пару пикселей в отступах погоды не сделают


Эта страница в полной версии