Question

I have 2 divs next to each other. The left hand one is 600px wide and the right hand is 200px wide, plus a little spacing etc. Both div’s are floated left so that if the page is displayed in a smaller window the right hand div drops down below.

What is want is for that right hand div to expand and become 600px wide if it is pushed onto the second row. But if there is 200px of space on the top row then I want it to display there at 200px.

Please help.

Answer 1

You should really look into media queries if you’re trying to adapt your page for mobile devices.

#yourSecondDiv {
    width: 200px;
}

@media only screen and (max-width : 799px) {
    #yourSecondDiv {
        width: 100%;
    }
}

Might be helpful also – media queries for standard devices