...

View Full Version : Resolved Floated Div tag extending beyond container div



HDRebel88
05-04-2011, 12:39 AM
Having an issue clearing a floated div tag.

http://ghosthuntersportal.com/index.php

The block of "test" text should force the content portion of the site to extend lower so it's border is wrapping that block of text. I've put clear: both every I can think of, but still no luck. Anybody seeing something I'm not?

Thanks.



<?php

$date_index="5/1/2011";
$year = date(Y);
if($year!="2011"){
$copyrightdate="- ".$year."";
}
$page="index";
include 'pages.php';
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<base href="http://ghosthuntersportal.com/" />
<title>Ghost Hunter's Portal <?php echo "$title_section"; ?></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="verify-v1" content="" />
<meta name="keywords" content="ghost, hunters, hunter, ghosts, spirit, spirits, paranormal, investigation, investigator, investigators, k2, emf, meter, kii" />
<meta name="description" content="Ghost Hunters Potal. Parnormal research equipment store." />
<meta name="author" content="Andrew McCarrick" />
<meta name="robots" content="index, follow" />

<?php
if($_GET['donate']=="thankyou"){
echo '<meta http-equiv="refresh" content="5;url=http://makethemoviehappen.com/index.php">';
}
elseif($_GET['donate']=="cancel"){
echo '<meta http-equiv="refresh" content="1;url=http://makethemoviehappen.com/index.php">';
}
else{
}
?>
<style type="text/css">
<?php
if (strstr($_SERVER["HTTP_USER_AGENT"], "MSIE 7")) {
echo 'body {background-color: #000000; color: #FFFFFF; font-family: Tahoma; margin-top: 10px;
margin-right:auto;margin-left:auto;max-width:1000px;}';
} else {
echo 'body {background-color: #000000; color: #FFFFFF; font-family: Verdana; margin-top: 10px;
margin-right:auto;margin-left:auto;max-width:1000px;}';
}
?>
</style>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="header">
<div class="logo"><img src="./logo.png" alt="Ghost Hunter's Portal" /></div>
<div class="tag"><img src="./tag.png" alt="Ghost Hunter's Portal" /></div>
<div class="header_right">
<div class="ad">

</div>
<div class="header_links">
Home | View Cart | Returns | About Us | Contact Us
</div>
</div>
</div>
<div class="content_wrapper">
<div class="links">
<div class="bold spacer3">Categories</div>
<div>Test</div>
<div>Test</div>
<div>Test</div>
<div>Test</div>
<div>Test</div>
</div>
<div class="main">
<div class="search">
&nbsp;
</div>
<div class="content">
TestTestT estTestTestTestTestTestTestTes tTestTestTestTestTestTestTestTes tTestTestTestTestTestTestT estTestTestTestTestTestTestTestTest
TestTestTes tTestTestTestTestTestTestTe stTestTestTestTestTestTest TestTestTestTestTestTestTestTe stTestTestTes
TestTestTestTestTes tTestTestTestTestTestTestTestTest TestTestTestTestTestTestT estTestTestTest TestTestTest TestTestTest
TestTestTestTestTestTestTestTe stTestTestTestTestTestT estTestTestTestT estTestTestTe stTestTestTestT estTestTestTes tTestTestT
estTestTestTestTestTe stTestTestTestTe stTestTestTestT estTestTestTes tTestTestTestTestTestTestTestTestTest TestTest
TestTestTestTestTes tTestTestTes tTestTestTestTestTestTest TestTestTestTestTestTest TestTestTestTestTest TestTest
TestTestTestTestTestTest TestTestTestTestTest TestTestTestTestTest TestTestTestTestTest TestTestTestTestTest TestTest
TestTestTestTestTestTestTestTestTestTestTestTestTest TestTestTestT estTestTestTestTestTestTestTestT estTestTest
TestTestTestTestTest TestTestTestTe stTestTestT estTes t TestTestTest TestTestTestTe stTestTestTe stTestTestTest
TestTestTestTes tTestTestTestTestTestTest TestTestTestTestTestTe stTestTestTestTestTestT estTestTestTestTes tTest
TestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest TestTestTest
TestTestTestTestT estTestTestTestTestTestTestTe stTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest
TestTestTestTestTestTestTestTestTestTestTestTestTestTestTes tTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest
TestTestTestTestTestTe stTestTestTestTestTestTestTestTestTestTestTestTestT estTestTestTestTestTestTestTestTestTestTest
TestTestTestTestTestTestTestTestTestTestTestTestTestTestT estTestTestTestTestTestTestTestTestTest TestTestTestTestTestTestTestTest
TestTestTestTestTestTestTestT estTestTestT estTestTestTestTestTestTestTestTestTestTestTestTestTest TestTestTestTestTestTestTestTestTest
TestTestTestTestTest TestTestTestTestTestTestTestTestTes tTestTestTestTestTestTestTestTestTestTestTes tTestTestTestTestTestTestTestTest
TestTestTestTestT estTestTestTestTestTestTestTestTestTestTestTestTestTes tTestTestTestTestTestTest TestTestTestTestTestTestTestTestTest
TestTestTestTest TestTestTestTestTestTest TestTestTest TestTestTestTestTestTestTestTestTestTestTe stTestTestTestTestTestTestTestTestTest
TestTestTestTestTest TestTestTestTestTestTestTes tTestTestTestTestTestTestTestTestTe stTestTestTestTestTestTestTest
TestTestTestTestTestT estTestTestTestTestT estTestTestTestTestTestTestTestTestTestTes tTestTestTestTestTestTestTest
TestTestTestTestTestT estTestTestTestTestTestTestTestTest
<? echo $content; ?>
</div>
</div>
<div class="footer">
&copy; 2011 <?php echo $copyrightdate; ?> Andrew McCarrick (Designed by: Andrew McCarrick)
</div>
</body>
</html>




a:link {color: #0000FF;}
a:visited {color: #0000FF;}
a:active {color: #0000FF;}
a:hover {color: #0000FF;}

a.back:link {text-decoration: none; color: #0000FF;}
a.back:visited {text-decoration: none; color: #0000FF;}
a.back:active {text-decoration: none; color: #0000FF;}
a.back:hover {text-decoration: none; color: #0000FF;}

.wrapper{
width: 995px;
border: 2px;
border-color: #CD0000;
margin-left: 2px;
border-style: solid
}

.header{
width: 999px;
height: 75px;
border: 2px;
border-color: #660066;
border-style: none;
border-bottom-style: solid;
}

.logo{
float: left;
margin-top: -12px;
margin-left: -3px;
height: 76px;
width: 460px;
}

.tag{
float: left;
margin-top: 40px;
margin-left: -453px;
height: 35px;
width: 460px;
}

.header_right{
width: 530px;
height: 74px;
float: left;
}

.header_links{
width: 375px;
height: 16px;
text-align: right;
font-size: 14px;
margin-left: 148px;
}

.ad{
margin-left: 148px;
width: 375px;
height: 52px;
text-align: center;
}

.adposition{
}

.adspacer{
}
.adspacer2{
}

.content_wrapper{
width: 995px;
height: 100%;
min-height: 530px;
border: 2px;
border-color: #660066;
border-style: solid;
border-top-style: none;
}

.spacer3{
margin-top: -10px;
margin-bottom: 3px;
}

.links{
margin-top: 15px;
float: left;
clear: both;
width: 200px;
text-align: center;
}

.main{
float: right;
width: 790px;
height: 100%;
min-height: 530px;
border: 2px;
border-color: #660066;
border-style: none;
border-left-style: solid;
}

.search{
height: 30px;
width: 790px;
}

.content{
height: 100%;
min-height: 500px;
width: 790px;
}

.footer{
float: left;
width: 995px;
margin-top: 5px;
text-align: center;
font-size: 11px;
clear: both;
}

.seventypercent{
width: 70%;
}

img{
border: 0px;
}
.center{
text-align: center;
}
.underline{
text-decoration: underline;
}
.bold{
font-weight: bold;
}
.italics{
font-style: italic
}
.eleven{
font-size: 11px;
}
.twelve{
font-size: 12px;
}
.fourteen{
font-size: 14px;
}
.sixteen{
font-size: 16px;
}
.gray{
color: #6F6F6F;
}
.eighteen{
font-size: 18px;
}
.twentyeight{
font-size: 28px;
}
.twentysix{
font-size: 26px;
}
.thirtytwo{
font-size: 32px;
}
.skyblue{
color: #3399FF;
}
.red{
color: #FF0000;
}
.green{
color: #008800;
}
.blue{
color: #000000;
}
.fortyfive{
width: 45%;
}
.sixty{
width: 60%;
}
.twenty{
width: 20%;
}
.clear{
clear: both;
}

teedoff
05-04-2011, 01:04 AM
Try adding


overflow: auto;

to your content_wrapper.

HDRebel88
05-04-2011, 02:27 AM
Alright, that took care of that. Thanks. But now the copyright (footer) is being pulled up into the content_wrapper div. Ideas to fix that, so it sits outside the content_wrapper.

teedoff
05-04-2011, 02:40 AM
Move that footer div outside the closing content_wrapper div.

HDRebel88
05-04-2011, 03:29 AM
Ahh... Well it was intended to be outside that content_wrapper div. I missed the closing </div> for that opening tag. Fixed now, thanks.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum