I'm basically trying to setup a 3-column layout for my header, without any spacing between the DIVs to it appears as one "cell". I'm using this to acheive a rounded corner look, so there's an image for each of the 3 columns - 2 rounded corners and one in the middle that repeats and fills 100% width to shrink and grow.
My problme is that I have verticla spaces between each of the 3 DIVs instead of them running up right next to each other. The width of the conrer DIVs is equal to the background image width, which also equals the margins given to the center div. Even If I shrink or grow the corner widths, the space still exists.
I've 0'd out all my elements in the stylesheet to start with, and also added the "fix" I've seen mentioned about IE not liking empty DIV tags. Still no luck.
I've moved over just the basic DIVs and CSS to new pages that I'm trying to fix to avoid any other cross-formatting - both HTML and CSS below.
Thanks in advance,
-chris
<!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>
<title>Untitled Page</title>
<link href="StyleSheet2.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="master_contentheader_l
eft"><!-- --></div>
<div id="master_contentheader_r
ight"><!--
--></div>
<div id="master_contentheader_m
iddle"><!-
- --></div>
</body>
</html>
body, div, p, h1, h2, h3, h4, ul, li, table
{
margin: 0;
padding: 0;
border: none;
}
body
{
background: #B4B4B4 url(images/body_bg.gif) repeat left top;
font-family: Tahoma, Arial, sans-serif;
font-size:75%;
}
#master_contentheader_left
{
height: 19px;
width: 6px;
background: url(images/coltop_left.gif
) no-repeat left top;
float: left;
}
#master_contentheader_righ
t
{
height: 19px;
width: 102px;
background: url(images/coltop_right.gi
f) no-repeat right top;
float: right;
}
#master_contentheader_midd
le
{
height: 19px;
background: url(images/coltop_middle.g
if) repeat-x left top;
margin-left: 6px;
margin-right: 102px;
}
