Hello Imar, and anyone else who reads this
I have a question regarding CSS.
On pages 81-82, step 8 of the TryItOut, there are some CSS rules.
What really confuses me is the float property.
Here what I understood after consulting this website:
www.w3schools.com:
You can float elements to the right or the left. Any element that follows the floated element will flow around the floated element on the other side.
For example, if I float an image to the left, any text or other elements following it will flow around it to the right. And if I float an image to the right, any text or other elements following it will flow around it to the left.
So far so good, but that's not in keeping with the book's example, and I'll explain.
On page 84, book says "You need to tell the Sidebar to float as well; if you leave it out, it will be placed at the left of the page, right where it was before you applied the CSS."
The thing is, it's correct, the MainContent element has float:left, but still without telling the Sidebar to float, it wouldn't float, namely, it wouldn't flow around it to the right.
But that's so not in keeping with what I typed above.
I've played around with things, and if float:right is given to the MainContent element instead of float:left, and the float property is deleted completely for the Sidebar element, the behavior will be as expected, namely, the Sidebar element will move to the left of MainContent.
So why in the book's example, both elements, MainContent and Sidebar must have the float:left property, in order to receive the desired behavior, whereas according to the definition of the float property, only MainContent should have it?
Thanks for any help guys...
CSS - float property
button below this post to show your appreciation!
