Help with IE6

pro_se · March 7, 2007

Hiya! I recently began another project using Photoshop to slice a web design and I realized that when you slice things it creates tables that are not XHTML valid... I was quite disappointed and did some research trying to find a way around this. I ended up making all the tables into divs...

I have one question though... [http://cvnetworks.net/uploads/75.jpg] Notice on the bottoms of the content panes there is that random thing... I don't know what that is... I have tried to remove it using all my prior knowledge but failed... I have also attached the code hoping one of you wonderful people have the time to take a look at it to maybe identify the problem...

html--

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<!--[if IE 6]>
<style type="text/css">
.nav {
padding-top: 20px;
} </style>
<![endif]-->
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/bg.gif);
background-repeat: repeat-x;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.wrap {
position: relative;
width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.header {
position: relative;
height: 153px;
}
.nav {
position: relative;
margin-top: -12px;
margin-left: -20px;
height: 32px;
font-size: 20px;
margin-left: auto;
    margin-right: auto;
}
.nav li {
list-style: none;
float: left;
margin: 0px 40px;
}
.nav li a {
color: #cc3333;
}
.nav li a:hover {
color: #666666;
}
.mainsep {
height: 38px;
position: relative;
background-image: url(images/topbox.gif);
}
.left {
width: 282px;
position: relative;
background-image: url(images/left-main.gif);
background-repeat: repeat-y;
float: left;
}
.left-btm {
position: relative;
width: 282px;
float: left;
}
.right {
width: 518px;
position: relative;
background-image: url(images/right-main.gif);
background-repeat: repeat-y;
float: left;
}
.right-btm {
position: relative;
width: 518px;
float: left;
background-color: #FFFFFF;
}
.boxed-content {
padding-left: 25px;
padding-right: 19px;
}
.footer {
position: relative;
font-size: 10px;
}
-->
</style></head>

<body><div class="wrap">
  <div class="header"><a href="#"><img src="images/header.gif" alt="NoTexting" width="799" height="153" border="0" /></a></div>
  <div class="nav"><ul>
  	<li><a href="#">Home</a></li>
    <li><a href="#">Login</a></li> 
    <li><a href="#">Register</a></li> 
    <li><a href="#">Help</a></li> 
    <li><a href="#">About</a></li>
  </ul></div>
  <div class="mainsep"></div>
  <div class="left"><p class="boxed-content">login area...</p>
<div class="left-btm"><img src="images/left-bottom.gif" width="282" height="26" border="0" /></div>
  </div>
  <div class="right"><p class="boxed-content"><strong>Lorem ipsum dolor sit amet,</strong> consectetuer adipiscing elit. Nunc pulvinar nunc ac quam. Donec at diam. Donec aliquam posuere nisl. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris libero eros, tempor sit amet, hendrerit a, dictum ut, pede. Maecenas consequat bibendum mauris. Aliquam id quam bibendum urna scelerisque interdum. In commodo lorem eu eros. Etiam ut sapien eget elit ullamcorper lobortis. Proin ipsum erat, elementum sed, tempus vel, sagittis sit amet, purus.</p>
  <div class="right-btm"><img src="images/right-bottom.gif" width="517" height="50" border="0" /></div>  
  </div>
<div class="footer" align="center">Footer Text goes here </div>
</div>
</body>
</html>

Sign In

Help with IE6

Recommended Posts

pro_se

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information