...

View Full Version : menu problems in ie



phucker
12-12-2007, 05:05 AM
ok after reading this you will find i am a complete n00b when it comes to coding. i am trying to build my first css site and i have had tons of problems. to make a long story short my good computer took a dump on me and now i am using a pos that has some sort of adware i havent had time to remove until today, so i havent been able to test my site with ie. in fire fox everything works fine but in ie my menus are all messed up. now being that i am new here should i post up the txt from my css and html or should i just give the web address to the site? sorry i know you guys probably hate idiots, i know i get fed up with all of the same questions getting asked on the forums i am on. please be kind though lol

rmedek
12-12-2007, 05:23 AM
now being that i am new here should i post up the txt from my css and html or should i just give the web address to the site?

The more the better. Post your code (in
tags), a link to the page, anything is better than nothing.

phucker
12-12-2007, 05:30 AM
ok thanks for the fast reply, here is a link to the site
www.danracing.com

and here is the css

body {
background-image:url(images/glamis2.jpg);
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color:#475B85;
margin: 0px;
padding: 0px;
height: 100%;
background-repeat: no-repeat;
background-color:#bfae89;
background-position:top;
}
* {margin: 0px;padding: 0px;}
p {
padding: 10px 0px 10px 20px;
display:block;
color: #6077A9;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}
a {
color:#475B85;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}
z {
color:#6077A9;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
}
#container {
margin: 0px auto;
text-align: left;
width: 900px;
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
}
#header{
height:250px;
width:800px;
background-repeat: no-repeat;
background-position:center;
background-position: top;
padding: 0px 0px 50px 100px;
}
#content{
padding-bottom: 40px;
position: relative;
}
#left{
width:192px;
float:left;
}
#middle{
position: relative;
margin-left:206px;
margin-right:196px;
width:450px;
}
#right{
width:192px;
float:right;
}

/********************* menu ****************************/
b ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px; /* Width of Menu Items */
border-bottom: 0px solid #857147 ;
border-top: 0px solid #857147;
border-right: 0px solid #857147;
border-left: 0px solid #857147;
background-color: #BFAE89;
}

b ul li {
position:static;

list-style: none
}

b li ul {
position: absolute;
left: 130px; /* Set 1px less than menu width */
top: 0px;
display: none;
background-color: #BFAE89;
list-style: none
}

/* Styles for Menu Items */
b ul li a {
display: block;
text-decoration: none;
color: #857147;
background-color: #BFAE89; /* IE6 Bug */
padding: 5px;

border-bottom: 0;
list-style: none
}

/* Fix IE. Hide from IE Mac \*/
* html b ul li { float: left; height: 1%; }
* html b ul li a { height: 1%; }
/* End */

b ul li a:hover { color: #8899BF; background: #BFAE89; } /* Hover Styles */

b li ul li a {
padding: 2px 5px;
background-color: #BFAE89;
} /* Sub Menu Styles */


b li:hover ul, b li.over ul { display: block; } /* The magic */
.menucontent{
width:170px;
background-image:url(images/menumiddle.gif);
padding-top:10px;
background-repeat: repeat-y;
background-color: #BFAE89;
color: #857147;
}.menuheader h3{
padding: 10px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
background-color: #BFAE89;
color:#857147;

width:150px;
}
.menufooter{
width:170px;
height:15px;
background-image:url(images/menubottom.gif);
color:#BFAE89;
display:block;
}
.postheader,.menuheader{
text-transform: uppercase;
width:200px;
}
/********************* post ****************************/
.post{
margin-bottom:15px;
background-position:top;
}
.postheader{
background-image:none;
display:block;
width:550px;
height:33px;
}
.postheader h1{
position:static;
padding: 7px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 36px;
font-weight: bolder;
font-style: italic;
}

.postcontent{
background-image:none;
background-repeat: none;
padding: 20px 0px;
}
.postfooter{
background-image:none;
background-repeat: no-repeat;
display:block;
width:450px;
height:15px;
}
/********************* header ****************************/
#header{
position:relative;
}
#header ul{
position:absolute;
top:240px;
display:block;
left:168px;
}
#header ul li{
display:inline;
text-align:center;
margin:auto;
width:auto;
border-right: 1px solid #475B85;
color:#475B85;
}
.last{
border-right: 0px none #6b7272 !important;
}
#header ul li a{
display:inline;
text-align:center;
text-decoration:none;
padding: 0px 10px;
text-transform: uppercase;
}
#header ul li a:hover{
text-decoration:underline;
}
/********************* footer ****************************/
#footer{
width:100%;
position: fixed;
bottom: 0 !important;
bottom: 0px;
height: 40px;

}
#footer ul{
display:block;
margin-left:190px;
color:#BFAE89;
}
#footer ul li{
display:inline;
text-align:center;
margin:auto;
width:auto;
border-right: 1px solid #6b7272;
}

#footer ul li a{
display:inline;
text-align:center;
text-decoration:none;
padding: 0px 10px;
text-transform: uppercase;
}
#footer ul li a:hover{
text-decoration:underline;
}
#footer span{
color:#525757;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
text-align:center;
width:850px;
display:block;
padding: 15px 0px;
}
/********************* menu members ****************************/
.menu ul{
list-style-position: inside;
list-style-type: disc;
padding: 0px 0px 0px 20px;
color:#666666;
}
.menu ul li{
padding-top: 5px;
color:#666666;
display:inline;
}
.menu ul li a{
text-decoration:none;
padding: 0px;
text-transform: uppercase;
}
.menu ul li a:hover{
text-decoration:underline;
text-transform: uppercase;
li:hover ul, li.over ul { display: block; } /* The magic */
}
.memberheader h3{
padding: 10px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
background-color: #88B5BF;
width:360px;
}
.membercontent{
width:380px;
background-image:url(images/menumiddle.gif);
padding-top:10px;
background-repeat: repeat-y;
background-color: #BFAE89;
}
.member{
display:inline;
float:left;
margin-left:10px;
}
.member span{
display:block;
text-align:center;
padding: 2px 0px 13px 0px;
text-transform: uppercase;

}
.member img{
width:160px;
height:120px;
border: solid 2px #999999;

}
.partsheader h3{
padding: 10px 0px 0px 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 30px;
font-weight: bold;
width:450px;
}
.partscontent{
width:450px;
padding-top:10px;
background-repeat: repeat-y;
}
.parts{
display:inline;
float:left;
margin-left:10px;
}
.parts img{
width:400px;
height:300px;
border: solid 2px #999999;

}
.clear{
clear:both;
}



and the html for the page i am really having problems with


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title> D.A.N. Racing 660R Exhaust</title>
</head>

<body>
<div id="container">
<div id="header">
<ul>
<li><a href="http://www.danracing.com/products.html">products</a></li>
<li><a href="http://www.danracing.com/services.html">services</a></li>
<li><a href="http://www.danracing.com/ordering.html">ordering</a></li>
<li><a href="http://www.danracing.com/contact.html">contact</a></li>
<li><a href="http://www.danracing.com/about.html">about us</a></li>
<li class="last"><a href="http://www.danracing.com/friends.html">friends</a></li>
</ul>
</div>
<div id="content">
<div id="left">
<div class="menu">
<div class="menuheader"><h3>Products</h3></div>
<div class="menucontent">
<b>
<ul>
<li><a href="#">Exhaust</a>
<ul>
<li><a href="http://www.danracing.com/660exhaust.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700exhaust.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450exhaust.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Stroker Cranks</a>
<ul>
<li><a href="http://www.danracing.com/660crank.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700crank.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450crank.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Connecting Rod</a>
<ul>
<li><a href="http://www.danracing.com/660rod.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700rod.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450rod.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">FCR Carbs</a>
<ul>
<li><a href="http://www.danracing.com/660carb.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/450carb.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Camshafts</a>
<ul>
<li><a href="http://www.danracing.com/660cam.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700cam.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450cam.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Valve Kits</a>
<ul>
<li><a href="http://www.danracing.com/660valve.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700valve.html">Raptor 700R</a></li>
<li><a href="href=www.danracing.com/450valve.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Pistons</a>
<ul>
<li><a href="http://www.danracing.com/660piston.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700piston.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450piston.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Intakes</a>
<ul>
<li><a href="http://www.danracing.com/660intake.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700intake.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450intake.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Gaskets</a>
<ul>
<li><a href="http://www.danracing.com/660gasket.html">Raptor 660R</a></li>
<li><a href="http://www.danracing.com/700gasket.html">Raptor 700R</a></li>
<li><a href="http://www.danracing.com/450gasket.html">YFZ450</a></li>
</ul>
</li>
<li><a href="#">Lock-Up Clutch</a>
<ul>
<li><a href="http://www.danracing.com/660lockup.html">Raptor 660R</a></li>
</ul>
</li>
</ul>
</b>
</div>
<div class="menufooter"></div>
</div>
<div class="menu">
<div class="menuheader"><h3>Helpful Sites</h3></div>
<div class="menucontent">
<p><a href="http://www.bluetraxx.com">Bluetraxx</a></p>
<p><a href="http://www.raptorforum.com">Raptor Forum</a></p>
<p><a href="http://www.Raptortranny.com">Raptor Tranny</a></p>
</div>
<div class="menufooter"></div>
</div>
</div>

<div id="middle">
<div class="post">
<div class="partsheader"><h3>660R Exhaust</h3></div>
<div class="partscontent">
<div class="parts">
<a>I carry what I feel is the absolute best perfoming exhaust systems made. Barkers exhaust is 100% American made. All stainless steel and billet aluminum construction.</a>
<p align="center">&nbsp;</p>
<z>Barker Duals Price:</z>
<p align="center">&nbsp;</p>
<img src="images/660dual.jpg" alt="parts" />
<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>
</div>
</div>
<div class="parts">
<z>Barker Drag Pipes Price:</z>
<p align="center">&nbsp;</p>
<img src="images/drags.jpg" alt="parts" />
<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>
</div>
<div class="parts">
<z>Barker Slip-On Price:</z>
<p align="center">&nbsp;</p>
<img src="images/slipon.jpg" alt="parts" />
<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>



<div class="postfooter"></div>
</div>
</div>
</div>
</div>
<div id="footer">
<ul>

</ul>
<span>Copyright 2007 D.A.N. Racing. All rights reserved.</span> </div>
</div>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum