CSS: Block width should stay fixed until sidebars reach little width

Question

I have <div> block, that have some fixed width. Sidebars stretch until their width reach some value. Then block should stretch instead of sidebars. How can I implement this in CSS?

"Sidebars" are just <div>'s margin (space).

Solution:

div
{
    /* Left and right margin stretch from zero to infinity */
    margin:0 auto;

    /* 2em is minimal side width */
    padding: 0 2em;

    /* Expected width */
    max-width: 640px;

    /* Minimal width */
    min-width: 320px;
}

Answer 1

I think you're looking for the min-width property: http://www.w3schools.com/CSS/pr_dim_min-width.asp. Or max-width: http://www.w3schools.com/css/pr_dim_max-width.asp.

However this doesn't have full support in all browsers.

Answer 2

One way would be to surround all the <div>'s in a larger div's which is a total size of all of them, then perhaps impose a min-width on all three. But Internet Explorer doesn't work well with this.