Hi!
This was your initial html code:
Quote:
<div id="banner">
<a href="http://www.sythix.co.uk/working/index.html">
<img id="logo" height="52" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_02.gif"
width="154" border="0"></a><a href="http://ww.sythix.co.uk/blog/"><img height="52"
alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_03.gif" width="140"
border="0"></a>
<img height="10" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_04.gif"
width="682"></div>
<div id="buttons">
<a href="http://www.sythix.co.uk/working/index.html">
<img id="home" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_06.gif"
width="80" border="0" name="home"></a><a href="http://www.sythix.co.uk/working/media.html"><img
id="media" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_08.gif"
width="80" border="0"></a><a href="http://www.sythix.co.uk/working/about.html"><img
id="about" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_10.gif"
width="80" border="0"></a><a href="http://www.sythix.co.uk/blog/"><img id="blog"
height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_12.gif"
width="80" border="0" name="blog"></a><a href="http://www.sythix.co.uk/working/contact.php"><img
id="contact" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_14.gif"
width="80" border="0"></a></div>
|
The initial CSS styles:
Quote:
#buttons {
WIDTH: 682px; PADDING-TOP: 10px; HEIGHT: 26px; BACKGROUND-COLOR: #1e1e1e;
}
#home {
MARGIN-LEFT: 8px; MARGIN-RIGHT: 68px;
}
#about {
MARGIN-LEFT: 66px; MARGIN-RIGHT: 70px
}
#contact {
MARGIN-LEFT: 63px; MARGIN-RIGHT: 7px
}
|
I've made a few changes, and in my IE7 and FF it looks ok.
Changes to HTML :
Quote:
<div id="banner">
<a href="http://www.sythix.co.uk/working/index.html">
<img id="logo" height="52" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_02.gif"
width="154" border="0"></a><a href="http://ww.sythix.co.uk/blog/"><img height="52"
alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_03.gif" width="140"
border="0"></a>
</div>
<div id="buttons">
<img height="10" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_04.gif"
width="682"><br />
<a href="http://www.sythix.co.uk/working/index.html">
<img id="home" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_06.gif"
width="80" border="0" name="home"></a><a href="http://www.sythix.co.uk/working/media.html"><img
id="media" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_08.gif"
width="80" border="0"></a><a href="http://www.sythix.co.uk/working/about.html"><img
id="about" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_10.gif"
width="80" border="0"></a><a href="http://www.sythix.co.uk/blog/"><img id="blog"
height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_12.gif"
width="80" border="0" name="blog"></a><a href="http://www.sythix.co.uk/working/contact.php"><img
id="contact" height="26" alt="" src="Sythix%20Web%20%20Aaron%20Thomas_files/sythix_14.gif"
width="80" border="0"></a></div>
|
Changes to CSS:
Quote:
#buttons {
WIDTH: 682px; PADDING-TOP: 10px; HEIGHT: 26px; BACKGROUND-COLOR: #1e1e1e; height: auto; vertical-align: middle;
}
#home, #media, #about, #blog, #contact {
margin: 1px 68px 0px 8px; /* T R B L */
}
|
HTH