PDA

View Full Version : CSS rendering Problem



Sourcer
04 Nov 2005, 04:30 PM
Ok for some reason for the life of me I cant get this navigation to render right in Firefox. Normaly I have the issues with IE buts its firefox this time. Can some one take a quick look at ...

http://dev.signaturewebmedical.com/beverlyhillscosmeticdentistry/

here is the css



body {
background: url("images/bg.jpg") repeat;
font: 12px Verdana, Arial, Helvetica, sans-serif;
margin-right:0px;
margin-left:0px;
margin-top:0px;
padding:0px;
}

a{
color:blue;
}

a:hover{color:red;}

#frame {
width:820px;
height:;
padding:0px;
text-align:left;
border-left-width: 0px;
border-right-style: solid;
border-left-style: solid;
border-left-color: #889db3;
border-right-width: 0px;
border-right-color: #ffffff;
}

#topleft{
position:absolute;
left:0px;
top:0px;
width:546px;
}
#logo {
height:72px;
width:546px;
padding-top:0px;
padding-left:0px;
}

#menudiv{
position:absolute;
width:675px;
top:141px;
left:10px;
height:26px;
FONT-FAMILY:Verdana, Arial, Helvetica, sans-serif;
LIST-STYLE-TYPE: none;
FONT-VARIANT: small-caps;
padding-left:0px;
border-top:1px #beb088 solid;
border-bottom:1px #beb088 solid;
text-align:left;
}

html>body #menudiv{
left:60px;
}

#menu{
LIST-STYLE-TYPE: none;
FONT-VARIANT: small-caps;
margin-left:-50px;
}


#menu A {
PADDING-RIGHT: 6px; PADDING-LEFT: 5px;
FLOAT: left;
PADDING-BOTTOM: 0px;
COLOR: #000;
PADDING-TOP: 6px;
height:20px;
font-weight: bold;
TEXT-DECORATION: none;
text-shadow: black 3px 3px, yellow -3px -3px;
font-size:11px;
}

#menu A:hover {
color:white;
background-color:tan;
}

#menu LI {
DISPLAY: inline;
MARGIN: 0px;
TEXT-ALIGN: left;
}
hr{
text-align:left;
padding:0px;
width:620px;
margin:2px;
height:1px;
color:#beb088;
style:noshade;
}


#topright{
position:absolute;
top:50px;
left:460px;
}


#contenthome{
float:left;
margin-top:20px;
width:630px;
margin-bottom:20px;
}

html>body #contenthome{
margin-top:120px;
}

#contenthome p{
margin-left:15px;
font-size:110%;
line-height:110%;
}

#contenthome p.first{
padding-top:10px;
}

#footer{
height:40px;
float:left;
width:640px;
padding:5px;
text-align:center;
font: 10px Verdana, Arial, Helvetica, sans-serif;
color:#111111;
border-top:1px #beb088 solid;

}
#footer a{
color:#666;
font-weight: normal;
}
#footer a:hover{
color: #444444;
font-weight:bold;
}



.bigger {font-size:160%;}
.blu {color:blue;}
.blue2 {color:#0099cc;}
.orange {color:orange;}
.bold{font-weight:bold;}
.black1{color:#000;}

h1{
color:navy;
font-size: 130%;
padding:5px;
margin:0;
}

.nobold{font-weight:normal;}
}

h5{
color:#889db3;
margin:0;
padding:0;
}

h3{
font-size:100%;
color:navy;
margin:0;
padding:5px;
}

#contenthome img{
padding:5px;
padding-right:15px;
}

#contenthome ul li{
font-size:90%;
}

#contenthome ul li a{
color:blue;
text-decoration:none;
}
#contenthome ul li a:hover{
color:red;
text-decoration:underline;
}

#solutions ul{
list-style-type:square;
color:blue;
}

#solutions ul li{
padding:3px;
padding-bottom:8px;
color:#555;
}

#solutions ul li a{
font-weight:bold;
font-size:115%;
text-decoration:underline;
color:blue;
}

#contenthome a img{
border:1px tan solid;
padding:0;
margin:0;
}
#contenthome a:hover img{
border:1px blue solid;
}

#contactdiv{
float:right;
width:200px;
height:110px;
padding:10px;
text-align:center;
}

#contactdiv a{
font-size:150%;
color:red;
font-weight:bold;
text-align:center;
text-decoration:underline;
}

#contactdiv a:hover{
color:blue;
}

#portfoliodiv{
float:right;
width:200px;
height:auto;
padding:10px;
text-align:center;
}

p.quote{
font-size:110%;
display:block;
width:400px;
padding-left:80px;
text-align:center;
font-style:italic;
}

Sourcer
05 Nov 2005, 03:49 AM
anyone? have any ideas?