Problem stretching the content around a parent div

**kz2284** · 04-21-2012 08:56 AM

Hi!

I'm learning html and css, and I always use clear:both at the end of a container to strech it. However since the parent div has a margin child, it does not stretch. Could anybody explaim me why, and how to solve it?

here is how my css looks:
* {
margin: 0px;
padding: 0px;
background-color: black;
}

body {
width: 900px;
margin: 50px auto auto auto;
position: centered;
}

.container {
background-color: white;
overflow:auto;
}

.block{
float: left;
width: 600px;
}

.blue.square {
float: left;
height:300px;
width: 300px;
background-color:blue;
}

.red.stripe {
float: left;
height:75px;
width:100%;
margin:75px 0px 0px;
background-color: red;
}

.star {
float: left;
margin: 50px;
width: 50px;
height: 50px;
}

.clear {
clear: both;
}

here is the html

<html>
<head>
<title>Exercise 3.1</title>
<link type="text/css" href="index.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="blue square">
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
</div>
<div class="block">
<div class="red stripe"></div>
<div class="red stripe"></div>
</div>
<div class="clear"></div>
<div class="red stripe"></div>
<div class="red stripe"></div>
<div class="clear"></div>
</div>
</body>
</html>

Thank you

**Kor** · 04-22-2012 11:38 AM

You could have been more accurate. Which is your problem, after all? Can you detail a little bit?

Note: your document has no Doctype. Doctype is required. Give a Google for it.

**kz2284** · 04-22-2012 09:57 PM

I want the the container to expand around the block and blue.square, but since both div contain margin it does not expand. If I remove the margin the ccs file it expands, but it doesnt expand with the margin. I want to know how i can expand the container while keeping margin.

Thread: Problem stretching the content around a parent div

Thread Tools

Display

Problem stretching the content around a parent div

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions