Stacking Divs with CSS

问题

Im kinda new to CSS have been using tables for my html for years, Im trying to figure out how I can nest divs or stack them inside the content section of a 3 column layout. with tables I'd just do a new <tr> but if I float another div into the content line line it will appear parallel or vertically, when I want to appear beneath. is there another way to do this or am I missing the point of Divs here?

basic example code

        body {
        margin: 0px;
        padding: 0px;
        }
        #header {
        background: #438a48;
        width: 100%;
        }
        #leftcolumn {
        background: #2675a8;
        float: left;
        width: 25%;
        height: 700px;
        }
        #content {
        background: #000;
        float: left;
        width: 75%;
        height: 700px;
        }
        #footer {
        background: #df781c;
        clear: both;
        width: 100%;
        }

The HTML

        <div id="header">Header</div>
        <div id="leftcolumn">Left Column</div>
        <div id="content">Content</div>
        <div id="footer">Footer</div>

回答1:

You can just add divs inside the #content div... the nesting will force them to stay inside their parent ... (do not float those inner divs, to make them go one beneath the other..)

来源：https://stackoverflow.com/questions/4062783/stacking-divs-with-css