ID badge templates - Debt Consolidation - Find jobs - Find jobs - Kamala

PDA

View Full Version : How To Make My Text Clear The <div>'s!


Gray
Oct 30th 2004, 5:39 am
Hi,

I have decided to take on the task of doing away with all tables in a site I look after in favour of CSS.

One basic table I use at the moment places three images across the screen, equi-spaced. I have a paragraph of text before and after this table.

I have re-created this using CSS, but the paragraph of text that follows the three <div>'s is behind the three images. What have I done wrong?

Can someone help me pleeeeeeease!

The CSS for the three <div>'s is below.

#left {
position: absolute;
text-align:center;
left:0%;
width:33%;
background:#032951;
}

#middle {
position: absolute;
text-align:center;
left:33%;
width:33%;
background:#032951;
}

#right {
position: absolute;
text-align:center;
left:66%;
width:33%;
background:#032951;
}

Thanks in advance,

Gray

kavakava
Oct 30th 2004, 6:05 am
Hi,

try clearing the div containing the images by putting this line in your CSS for yor div containing the text:

clear: left;

See if that works.

expat
Oct 30th 2004, 6:10 am
Hi,

I rarely use absolute here is three column example within one div

.row{
}
.col1{
float:left;
background-color:white;
Xpadding:0 15px 25px 10px;
width:220px;
}
.col2{
background-color:#ddd;
float:left;
width:200px;
}

.col3{
background-color:#eee;
float:left;
width:180px;
height:500px;
}

float left should do it and you can exchange fixed width: by using
width: 33% etc.

I onlyuse hight to make sure the next container is pos nicely below... so you can eliminate this as well.

hope it helps
M

Gray
Oct 30th 2004, 7:15 am
Excellent!

Just used the above tips and it works!

Thank so much!

Gray