thehighhomie
@thehighhomie

Гибкие поля и отступы?

Как сделать гибкие поля когда используешь колоночную верстку типа

.container {
margin: 0 auto;
width: 92%;
}

.container .column1 {width: 8.333333333333334%;}
.container .column2 {width: 16.666666666666668%;}
.container .column3 {width: 25%;}
.container .column4 {width: 33.333333333333336%;}
.container .column5 {width: 41.66666666666667%;}
.container .column6 {width: 50%;}
.container .column7 {width: 58.333333333333336%;}
.container .column8 {width: 66.66666666666667%;}
.container .column9 {width: 75%;}
.container .column10 {width: 83.33333333333334%;}
.container .column11 {width: 91.66666666666667%;}
.container .column12 {width: 100%;}

Пробуя по макету вычислять через контекст контейнера , который по макету 1024px, в котором находится весь сайт, но не получается, не то совсем.
В контейнере,который условно считается 1024px а в коде 92% лежит еще 2 колонки по с шириной по 50%, то есть column6, в них есть элементы которые нужно отделить друг от друга отступами или полями, с маргинами делал я так:
ширина элемента, для которого нужны отступы не известна, и я брал за основу родительский контекст column6, который в лежит в контейнере c условной шириной в 1024px. Получается column6 условно 512px шириной. Отступ нужен в 20px - 20 / 512 * 100. Не получилось(.
Потом пробовал вообще контейнер за контекст взять, не получилось - 20 / 1024 * 100. Не получилось(

Читал книгу Итана Маркотта "Отзывчивый веб-дизайн", но там в примерах гибкие поля делались как то проще чем с колонками в 12 штук. Помогите пожалуйста разобраться.
  • Вопрос задан
  • 307 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы