...

View Full Version : floating div breaks div



me2
12-20-2007, 09:41 AM
the div classed incontent is broken when i put floating divs in it is there a way around it

html


<div class="content">
<div class="roundtop">
<img src="/images/topleft.php" alt="" width="20" height="20"></img>
<span class="heading">test</span>
</div>
<div class="incontent">
<div class="forum_poster">test</div>
<div class="forum_post">test</div>
</div>
<div class="roundbot">

<img src="/images/botleft.php" alt="" width="20" height="20"></img>
<div class="botborder"> </div>
</div>
</div>

css


div.content{
position: relative;
top: -30px;
left: -8px;
padding-bottom: 10px;
}
div.content div.incontent{
padding: 5px 15px;
border-left: 2px solid rgb(50, 110, 50);
border-right: 2px solid rgb(50, 110, 50);
color:#111111;
background-color: rgb(247, 247, 247);
font-family: Calibri;
}
.roundtop{
background: url(/images/topright.php) no-repeat top right;
background-color: rgb(50, 110, 50);
padding-bottom: 2px;
}
.roundbot{
background: url(/images/botright.php) no-repeat top right;
}
div.botborder{
height: 20px;
background-color: rgb(247, 247, 247);
border-bottom: 2px solid rgb(50, 110, 50);
margin-left: 20px;
margin-right: 20px;
margin-top: -21px;
position: relative;
top: 0px;
}
div.content span.heading{
color: white;
font-family: Verdana,Tahoma,Arial,Sans-Serif;
font-size: 16px;
font-weight: 600;
text-transform: capitalize;
letter-spacing: .5px;
}

Actinia
12-20-2007, 02:38 PM
Could you be more specific about what you mean by "incontent is broken when i put floating divs in it"?

Pasting your code into a blank page looks OK except that the div with a class 'forum_post' just shows the first letter (t) rather than the word 'test'. The classes forum_poster and forum_post are not defined. Nothing is being explicitly floated.

John Rostron

Apostropartheid
12-20-2007, 02:40 PM
div.content div.incontent{
padding: 5px 15px;
border-left: 2px solid rgb(50, 110, 50);
border-right: 2px solid rgb(50, 110, 50);
color:#111111;
background-color: rgb(247, 247, 247);
font-family: Calibri;
}

You do realize that 1) you haven't set up a backup font family and 2) practically no one has Calibri except those that have Office 2007?

me2
12-21-2007, 01:17 AM
Whoops i forgot to post this bit of css..



.forum_poster{
width: 20%;
float: left;
z-index: 3;
}
.forum_post{
width: 80%;
float: right;
z-index: 3;
}


Also Calibri was around in office 2003 i changed it to my default font at school and my home computer once i had used office 2007 but i would add a backup font.. would verdana look good

_Aerospace_Eng_
12-21-2007, 02:23 AM
You need to clear you floats. http://www.positioniseverything.net/easyclearing.html



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum