Как сделать последовательное уменьшение блоков?

Question

[b_efimenko]

Допустим есть 3 блока на сайте по 33%;
Как сделать так что бы при уменьшении экрана, сначала уменьшался первый блок (то есть переносилось его содержимое на новые строчки пока это возможно), а в это время два вторых оставались без изменений, за тем как первый уменьшится на максимум, что бы уменьшался второй, ну а за тем уже третий.
У кого есть идеи или кто то видел где то такое подобное, прошу помогите, заранее спасибо.

Answer 1

[Ringil Endimion]

Попробуйте как-то так:

@media only screen and (max-width:800px){
#block1{width:20%}
#block2{width:40%}
#block3{width:40%}
}
@media only screen and (max-width:600px){
#block1{width:20%}
#block2{width:20%}
#block3{width:60%}
}
@media only screen and (max-width:400px){
#block1{width:33%}
#block2{width:33%}
#block3{width:33%}
}

max-width и width подбираете как удобно.