Barrett wrote:
> Nope it should all be css what your're looking at. Doing a whole site
> makeover from ground up mainly at server side and eliminating tables
> from the layouts mostly.
> See this in IE and you'll see the gap.
> Hold on - I'll update the file with yellow background so it's more
> obvious.
> All the category levels should be nearly fully all css with no tables.
> Like this http://beta.handmade-paper.us/page/CPO/CTGY/mtx
>
> Got it working in Mac, FF for Win, but NOT IE
Well, obviously we're looking at the CSS, but the HTML is what you're
styling so we have to look at that as well. All of the technologies used
in web development are intrinsically connected. Incidentally, you might
also want to validate your HTML...while it's unlikely to be causing this
specific problem, as your site grows and errors accumulate, these things
get out of hand.
Anyway, it's just my opinion, but if I had to handle this page, I would
do it this way:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http\://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Mulberry Textured</title>
<meta http-equiv="content-language"
content="en-us" >
<meta http-equiv="content-type"
content="text/html; charset=UTF-8">
<style type="text/css">
html,
body {
margin: 0;
padding: 0;
}
#masthead {
background-color: #A52A2A;
}
#masthead h1 {
border-bottom: 3px solid #FFA500;
font-size: 1em;
height: 47px;
margin: 0;
overflow: hidden;
position: relative;
}
#masthead h1 #logo {
background-image:
url('http://beta.handmade-paper.us/Merchant2/graphics/nav/mast.gif');
background-repeat: no-repeat;
display: inline;
float: left;
height: 0;
overflow: hidden;
padding: 47px 0 0 0;
width: 780px;
}
#masthead h1 #cart {
background-image:
url('http://beta.handmade-paper.us/Merchant2/graphics/test6.png');
background-repeat: no-repeat;
bottom: 0;
color: #ffffff;
display: inline;
float: left;
margin: 12px 0 0 0;
padding: 10px 0 10px 30px;
}
#sitemenu {
background-color: #FFDAB9;
background-image:
url('http://beta.handmade-paper.us/Merchant2/graphics/nav/finest.gif');
background-position: 0 50%;
background-repeat: no-repeat;
list-style: none;
margin: 0;
overflow: hidden;
padding: 0 0 0 400px;
}
#sitemenu li {
display: inline;
float: left;
list-style: none;
margin: 0;
padding: 0;
}
#sitemenu li a {
color: #A52A2A;
display: block;
font-weight: bold;
text-decoration: none;
padding: 2px 5px;
}
#sitemenu li a:hover {
background-color: #ffffff;
}
</style>
</head>
<body id="www-handmade-paper-us">
<div id="masthead">
<h1>
<a href="#" id="logo">Creative Papers Online - Handmade-Paper.us</a>
<a href="#" id="cart">Items 0</a>
</h1>
<ul id="sitemenu">
<li><a href="#">Storefront</a></li>
<li><a href="#">Account</a></li>
<li><a href="#">Search</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Help</a></li>
</ul>
</div>
</body>
</html>
Hope it helps, but I recognize that it's just my two cents.
Best regards,
Bill
--
/**
* Bill Brown
* TheHolierGrail.com & MacNimble.com
* From dot concept...to dot com...since 1999.
***********************************************/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
