Hi
I'm having some issues with CSS and IE6(I know, who hasn't...)
I've created a box that displays 3 images horizontially each with an image description below the image. It looks fine in IE7 and FF, but when I open in IE6 the last character of the 3rd description is wrapped to the next line. In my example below "c" from "Img 3 Desc" shows up below the row of descriptions.
Does anyone know of a fix for this?
Thanks!
A sample of my html/css code is below:
body {
margin: 0;
padding: 0;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: x-small; /* for IE5/Win */
f\ont-size: small; /* for compliant browsers */
color: #fff;
background: #71828a url(../images/design_new1/bg_grad.jpg) fixed;
}
html>body { /* for Opera */
font-size: small;
}
#main-story {
float: left;
padding: 5px;
margin: 0;
}
.main-box1 {
float: left;
width: 490px;
background: url(../images/design_new1/round3.gif) no-repeat bottom left;
}
.imgdiv {
margin-left: 10px;
}
.img-box1 {
float: left;
width: 150px;
margin-right: 10px;
margin-top: 10px;
display: inline;
}
.img-box1 p {
margin: 0;
margin-bottom: 5px;
padding: 0;
font-size: 80%;
text-align: center;
}
.img-box1 p a {
color: #c2d3fe;
text-decoration: none;
}