0

It looks fine in IE. But went wrong in Firefox.
Also there seems to be a space to the right of each img button. :cry:

IE
http://imgboost.com/uploads/894333_screenshot2.jpg

FF
http://imgboost.com/uploads/113426_screenshot1.jpg

My Css

* {
margin: 0;
padding: 0;
}
html{
height: 100%;
margin: 0;
padding: 0;
}
body {
height: 100%;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin: 0;
padding: 0;
}

* html  #container  {
height: 100%;
}
#container {
position: relative;
min-height: 100%;
}
#topLinks
{
list-style: none;
}
#topLinks li
{
display: inline;
border-left: 1px solid #FFFFFF;
}
#topLinks li.topLinks_first
{
border-left: 1px solid #FFFFFF;
}
#topLinks li.topLinks_last
{
border-right: 1px solid #FFFFFF;
}
#topLinks a
{
color: #FFFFFF;
}
#header {
padding: 5px;
margin: 5px;
}
#footer {
width: 100%;
text-align:center;
position: absolute;
bottom: 0;
margin:0;
padding:0;
}
#footer_pink {
background: url('../images/footer_pink.gif') repeat-x;
height: 35px;
}
#bottomLinks
{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
list-style: none;
margin-top: 0;
margin-left: 0;
padding-top: 0.9em;
background-image: url(../images/footer_bg.gif);
background-repeat: no-repeat;
}
#bottomLinks li
{
display: inline;
border-left: 1px solid #FFFFFF;
padding-right: 1em;
padding-left: 1em;
}
#bottomLinks li.first
{
border-left: 0 none transparent;
}
#bottomLinks a
{
color: #FFFFFF;
}

#footer_yellow {
background: url('../images/footer_yellow.gif') repeat-x;
height: 55px;
}
.footer_yellow {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#333333;
}
#footer_content {
padding-top:1.0em;
}
#footer_yellow img {
border: none;
}
#menu {
background: url('../images/pink_menu.gif') repeat-x;
height: 37px;
text-align:center;
}
#menu a img {
border: none;
}
#menu ul {
padding:0px;
margin:0px auto;
}
#menu ul li{
display:inline;
list-style-type:none;
}

Edited by pritaeas: Fixed formatting

2
Contributors
1
Reply
2
Views
10 Years
Discussion Span
Last Post by Rhyan
0

Hi there.
It seems that you have defined at many placess <li> styles and your style is difficult to figure out.
Also - setting the LI element as in-line does not allow the heigh to take effect. For the li element, where you have set the border, you should put line-height: 37px; so it should do the trick.

Clean up a bit your css code, as it seems you have too many overriding settings.

Cheers

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.