Div Containers and Floating
- Thread starter PiKe
- Start date
Tried overflkow and clear method but neither produce the result I'm after
This is the html:
This is the html:
Code:
<style type="text/css">
<!--
#container {
border: 1px solid #000000;
}
-->
#float {
float:left;
height: 50px;
width: 100px;
}
</style>
</head>
<body>
<div id="container">This is a container
<div>This not floated and remains inside the container </div>
<div id="float">This is inside the container but floated left </div>
<div id="float">This is inside the container but floated left </div>
<div id="float">This is inside the container but floated left </div>
<div id="float">This is inside the container but floated left </div>
</div>
</body>
</html>I've tried inline and it still doesn't work right, the floats are always outside the container or they stack ontop of eachother inside the container, they need to be next to eachother.
Edit: This seems to have worked.
Edit2: You need clear both before and after the floats.
Edit: This seems to have worked.
Code:
<div class="container">This is a container
<div>This not floated and remains inside the container </div>
<div class="float">This is inside the container but floated left </div>
<div class="float">This is inside the container but floated left </div>
<div class="float">This is inside the container but floated left </div>
<div class="float">This is inside the container but floated left </div>
<div id="clear_both" style="clear:both;"></div>
</div>Edit2: You need clear both before and after the floats.
Last edited: