max-width - проблемы

[sifilis]

Есть вёрстка

<div id="header">
    <div class="logoheader">blablalba</div>
    <div class="emblemsHeader">blablabla</div>
    <div class="textHeader">blablabla</div>
</div>

Есть CSS

#header {
    height: 155px;
    margin-bottom: 17px;
    max-width: 1150px;
    position: relative;
    top: 17px;
}

.logoheader {
    float: left;
    margin: 0 !important;
    position: relative;
    width: 277px;
    z-index: 1;
}
.emblemsHeader {
    float: left;
    height: 153px;
    margin-left: -30px;
    overflow: hidden;
    position: relative;
    width: 129px;
    z-index: 0;
}
.textHeader {
    float: left;
    max-width: 773px;
    min-width: 623px;
}

Проблема в том, что textHeader на любом разрешении экрана принимает минимальную ширину в 623 пикселя, до 773 не растягивается. Если же указать дополнительно для него width: 100%, то блок съезжает вниз. Как решить эту проблему?

[DrStrangeLove]

попробуй задать overflow:hidden для контейнера.. может перестанет съежать...

[sifilis]

Не получилось

Плюнул на всё, сделал через jQuery

$(document).ready(function(){					
if(screen.width >= 1153) {
	$(".textHeader").width(773);
} else {
	$(".textHeader").width(screen.width-400);
}
});

Проще через jQuery сделать, чем гадать на кофейной гуще, чего это CSS не работает так, как ты хочешь.

Edited April 21, 2011 by sifilis

[psywalker]

А почему бы просто не растянуть последний блок на всю оставшуюся ширину?

[swetlana]

так ведь float: left.

Потому и не растягивается.

Не надо float.

[sifilis]

так ведь float: left.

Потому и не растягивается.

Не надо float.

Ах вон где собака зарыта. Спасибо большое!