Menu
I can't for the life of me find a way to make this work.
If I have 3 divs (a left sidebar, a main body, and a footer), how can I have the sidebar and main body sit next to each other without setting their positions as "absolute" or floating them? Doing either of these options result in the footer div not being pushed down by one or the other.
How might I accomplish this regardless of what comes before these elements (say another header div or something)?
In case it helps, here's an illustration of the two cases I'm trying to allow for:
Here's a simplified version of the HTML I currently have set up:
<div id="sidebar"></div>
<div id="content"></div>
<div id="footer"></div>
911
you just need to add float: left; to your <aside> section. Save this answer.
Float-based layouts take advantage of the float property to position elements side by side and create columns on a web page.
To set the heading alignment in HTML, we use the style attribute inside an HTML element. The attribute is used with the HTML <h1> to <h6> tag, with the CSS property text-align for setting alignment for an element.
One way to position elements on a page is with the float property. The float property is pretty versatile and can be used in a number of different ways. Essentially, the float property allows us to take an element, remove it from the normal flow of a page, and position it to the left or right of its parent element.
You need to specify the footer to clear the float:
#footer{
clear: both;
}
This forces it under floated elements.
Other options for clear are left and right.
174
Doing either of these options result in the footer div not being pushed down by one or the other?
Try this tool
26
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
