IE6 Problems

[shannonlp]

Here is my dilemma, These are the 2 pages
http://www.ecarttemplates.com/webHosting.php
http://www.ecarttemplates.com

webHosting.php problem there should be 3 rows of information. displayed in IE6 it shifts the information to the left.

With the main page there should be text saying Welcome Guest [Login | Register] | Register as Contributor Just below the top menu.

In every browser, IE7, Firefox 2.0, Opera 9, Mozilla, Netscape it works except for IE6.

The CSS is pretty large for these pages. let me know if someone has any pointers.

I did find a problem with IE7 overflowing 2 containers because of invalid size.

Thanks for any help.

[mlseim]

Try this:

In the file: "layout.css" ...

.colMid {
position: relative;
width: 550px;
float: left;
padding-left:5px;
}


and this one also ...

.colWebHosting{
background-color: #7899AC;
font-weight:bold;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 80%;
color: #FFFFFF;
text-align: left;
width: 500px;
height: 18px;
margin: 15px;
padding-left: 0px;
padding-bottom: 0px;
padding-top: 0px;
list-style-type:none;
}


NOTE:
If I happened to miss one, you can see that the problems have to do with padding
and width. When nesting <div>'s, if the padding+width exceeds the container size,
it will linefeed the <div>. You can use some overflow deals, but actually, it's best to
fix the problem. If fact, if you can avoid using width properties, that's best ... but
sometimes you have to force the width, so you need to calculate the widths properly.


.