Forum Moderators: not2easy
I am new to html and CSS and am having a problem understanding the IE& problem with floating columns or images. My site looks great in FF and other versions of IE but not in version 6.
I have seen lots of info about this problem but can't make head or tail of it. If anyone can shed some light I would be a happy bunny :-)
Here is some code that I hope is relevant
<snip>
HTML-
<img src="img/Telephone.jpg" alt="Telephone Number 0123 456 7890" title="Telephone example 0123 456 7890" />
</div>
<div id="email">
<a href="http://www.example.com/Contact-Us.html"><img src= "img/email.jpg" alt="email example" title="click to email example" /></a>
</div>
<div id="upload">
<a href="http://example.com/login.php?referrer=/index.php"><img src="img/upload_file.jpg" alt="Upload folder" title="upload folder"/></a>
</div>
<div id="navcontainer1">
CSS-
/*NAVIGATION RIGHT*/
#tele {
width : 160px;
margin :15px 0px 0px 0px;
float : right;
border-bottom: 2px solid #ffffff;
}
#email {
width : 160px;
margin :0px 0px 0px 0px;
float : right;
border-bottom: 2px solid #ffffff;
}
#upload {
width : 160px;
margin :0px 0px 0px 0px;
float : right;
border-bottom: 2px solid #ffffff;
}
#star {
width : 160px;
margin :15px 0px 0px 0px;
float : right;
border-bottom: 2px solid #ffffff;
}
#navcontainer1 {
width : 160px;
margin :15px 0px 0px 0px;
float : right;
border-color: #fff;
background-color: #E6F6F4;
}
#navcontainer1 ul {
margin-right : 0px;
list-style-type : none;
}
#navcontainer1 a {
display : block;
padding: 5px 0px 5px 0px;
width : 160px;
border-bottom: 2px solid #ffffff;
text-decoration : none;
color : #369;
font-size : 90%;
background : inherit;
}
Thanks for any help
[edited by: swa66 at 5:21 pm (utc) on Mar. 18, 2009]
[edit reason] NO personal URLs, use example.com and no specifics, plase see ToS [/edit]
(I hope I am correct in what I say)
I have a 3 column layout. The column I have on the right side drops down below the content in IE6.
I have a sidebar_right div that I set up but amd not using. Maybe this would help?
#sidebar_right {
float : right;
width : 150px;
padding : 0;
margin : 0;
border-top : 1px solid #fff;
font-size : 100%;
line-height : 1.8em;
background : #E6F6F4;
color : #333;
list-style-type: disc; color: blue;
}
Maybe I should add my doc type-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
The html and css have been validated too :-)
In many cases there's no easy to spot logic in the bugs, so just use a conditional comment and throw in things that fix it in IE6 so it looks ok. I have no need to try to understand IE bugs that Microsoft has no intention of ever fixing.