Hello all,
Please correct any issues on my interpretation:
The css:
.gs960 {
width: 960px;
margin: 0 auto;
background-color: blue;
}
#miniContainer {
width: 960px;
overflow:hidden;
background-color: red;
}
#sidebar {
width: 208px;
float: left;
background-color: yellow;
}
#cartContainer {
width: 100px;
background-color: green;
}
The html:
<body>
<div id="main">
<div class="gs960">
<div id="miniContainer">
<div id="sidebar">
<p>Side bar here</p>
</div>
<div id="cartContainer">
<p>I need to be on the right side of Side bar</p>
</div>
</div><!-- fecha miniContainer -->
</div> <!-- fecha gs660 -->
</div> <!-- fecha main -->
</body>
If I apply a float left to #cartContainer is stays on it’s side. But do I need it?
W/out it:
1)Why the #cartContainer doesn’t stay on the right side of #sidebar ?
It seems that the reason is because the element is floated and as a display block, hence, all elements will stay after it, on a “vertical line”.
However, if we do:
<div id="main">
<div class="gs960">
<div id="miniContainer">
<div id="sidebar">
<p>Side bar here</p>
</div>
<p>I need to be on theasdsa dasd asda
I need to be on theasdsa dasd asdas ad asd asd as das das right side of Side bar
I need to be on theasdsa dasd asdas ad asd asd as das das right side of Side bar
I need to be on theasdsa dasd asdas ad asd asd as das das right side of Side bar
I need to be on theasdsa dasd asdas ad asd asd as das das right side of Side bar
I need to be on theasdsa dasd asdas ad asd asd as das das right side of Side bar
s ad asd asd as das das right side of Side bar</p>
</div><!-- fecha miniContainer -->
</div> <!-- fecha gs660 -->
</div> <!-- fecha main -->
2)The <p>
(that is also block by default right? Doesn’t start after the #sidebar
, but at is side. Why?
Thanks.
Márcio