How To Make My Text Clear The <div>'s!

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

 

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.

 

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

 

Excellent!

Just used the above tips and it works!

Thank so much!

Gray

 

wonderful tips always

RUBY

 

this was like 6 years ago, how did you even dig this post..

 

Post count padding with searching old stuff?