Прижать div-ы к краям

[denism300]

контент располагается в две колонки. эти колонки обернуты в div-ы с классом .content.
как прижать левую колонку к левому краю, а правую, соответственно, к правому родительского блока block-out?
float: left и float: right не прокатит, т.к. контент генерируется модулем и div-ы имеют одинаковый класс. отдельно к левому или отдельно к правому класс добавить нельзя.

конструкция вида:

<div class="block-out">
<div class="content">
тут выводится контент
</div>
<div class="content">
тут выводится контент
</div>
</div>

css

.block-out {
width: 100%;
}
.content {
width: 45%;
margin: 10px;
float: left;
}

 

[mdss]

чеж нельзя то

.content {
width: 45%;
margin: 10px;
float: right;
}
.content:first-child {
float: left;
}

 

[qpPeW]

чеж нельзя то

.content {
width: 45%;
margin: 10px;
float: right;
}
.content:first-child {
float: left;
}

Вы то хоть сами поняли что написал ?
Для одного и того же блока задали одновременно "float: left;" и "float: right;", скорее всего хотели написать ":last-child", но я бы сказал что это не совсем правильно.
Лучше всего делать вот таким способом:

.content {
width: 45%;
margin: 10px;
}
.content:nth-child(1) {
float: right;
}
.content:nth-child(2) {
float: left;
}

А еще не забывать фиксировать высоту блоков content (с помощью "clear: both;"), что бы другие блоки на них не налезали.

 

[denism300]

Лучше всего делать вот таким способом:

спасибо, то, что нужно!

 

[qpPeW]

Всегда пожалуйста )

 

[HeadHunter]

Вы то хоть сами поняли что написал ?
Для одного и того же блока задали одновременно "float: left;" и "float: right;", скорее всего хотели написать ":last-child", но я бы сказал что это не совсем правильно.
Лучше всего делать вот таким способом:

.content {
width: 45%;
margin: 10px;
}
.content:nth-child(1) {
float: right;
}
.content:nth-child(2) {
float: left;
}

А еще не забывать фиксировать высоту блоков content (с помощью "clear: both;"), что бы другие блоки на них не налезали.

и передать большой пример IE и его семейству.

 

[qpPeW]

и передать большой пример IE и его семейству.

Ну это уже совсем другой разговор, лично я на него забиваю, т.к. работаю с линукса...

 

[mdss]

Вы то хоть сами поняли что написал ?

В курсе что такое переопределение? И как браузер считывает файл стилей? Пример я написал рабочий и намного более простой и лаконичный.

 

[mindnomind]

можно так

.content {
width:100%;
position:relative;
}
.content {
position:absolute;
}
.content:nth-child(1) {
right:0;
}
.content:nth-child(2) {
left:0;
}