Как сделать чтобы блок content не залазил за левое меню?

Question

[lynnikvadim]

Как сделать чтобы блок content не залазил за левое меню?
fiddle.jshell.net/84cn67qb

Answer 1

[A K]

.content {
        margin-left: 210px;
}

Comments

[lynnikvadim]

А если я не знаю ширину левой колонки!?
К примеру она вычисляется через javascript.

[A K]

lynnikvadim: вычислите и отступ, просто прибавьте 10px

Answer 2

[Владик Лимонадик]

Даете всем элементам box-sizing: border-box; (через * селектор)

Даете врапперу сайдбара и контента overflow: hidden;
Даете сайдбару и контену float: left; и width в процентах. например 20% и 75%
Даете сайдбару margin-right 100 - (20 + 75) в процентах

Радуетесь.

Comments

[Artem]

Селектору * задавать свойство box-sizing: border-box; крайне не разумно для построения сетки страницы, еще многие браузеры не адекватно его поддерживают, в итоге получим нарушение структуры.

[dpismenny]

Артем: Да ладно? caniuse.com/#search=box-sizing А по-поводу такого селектора, можно согласиться, но сейчас слишком многие его используют: гитхаб, бутстрап, этот сайт =)

[Владик Лимонадик]

Артем: чо, вендорные префиксы -webkit и -moz, лол, вы с какой планеты, где всё еще верстают под ie4?

[Artem]

pismenny: Возьмем браузер, к примеру Iceweasel 24.3.0 (модификация того же Firefox), как там обстоят дела с box-sizing: border-box; можно убедиться самостоятельно, открыв любой сайт с этим свойством (для примера можно заглянуть сюда же на toster). Экзотический браузер? Да ну, отговорки
Я лучше буду строить сетки, которые не потекут хотя бы в современных браузерах на любых платформах.
Владик Лимонадик: по крайней мере не только под Chrome и Firefox.

[Владик Лимонадик]

Артем: хз мне кажется вы ерундой занимаетесь. ни в одном нормальном проекте я не видел просьбы сапортить какие-то айсфисели и форки файрфоксов. chromium, chrome, ff, safari, android хотя бы 2+ и ios хотя бы 7+. и всё

[Artem]

Владик Лимонадик: в веб-студии или на бирже возможно, но когда работаешь над большим коммерческим проектом - другое дело.

[dpismenny]

Артем: Я не против, сам не применяю глобально box-sizing, но есть же тенденция, которую сложно отрицать. К тому же, большой коммерческий проект - это не совсем общий случай. Но, я рад, что есть люди, которые с умом используют "модные свойства".