June 9, 200917 yr Ok, I downloaded the Modern Brick menu from Dynamic Drive. The menu is working great, but when I make other links on my page, they seem to be taking on the styles from the menu. I am not sure if it's an issue with the menus code, or something with my page. Before you look at my code, I know I shouldn't be combining tables and CSS, but this is just a mockup I was trying to get quickly done when I ran into this problem. Here is the body of my html: <body> <div id="wrapper"> <div id="banner"></div> <div id="content"> <div id="modernbricksmenu2"> <ul> <li id="current" style="margin-left: 1px"><a href="index.html" title="Home">Home</a></li> <li><a href="howitworks.html" title="How It Works">How It Works</a></li> <li><a href="operation.html" title="Operation and Maintenance">Operation and Maintenance</a></li> <li><a href="faq.html" title="F.A.Q.">F.A.Q.</a></li> <li><a href="contact.html" title="Contact">Contact</a></li> <li><a href="links.html" title="Links">Links</a></li> </ul> <p><br /> </p> <div align="center"> <table width="776" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="517"> <div align="left"> <h1>SIMPLY THE BEST...</h1> <div class="just"> <p>INCINOLET electric incinerating toilet incinerates all human waste immediately to clean, germ-free ash, as little as a tablespoonful each use. Raw waste is not accumulated and is not seen. Water is not used in this toilet and nothing is drained out. INCINOLET is easy to install and can be used in any climate.</p> </div> <h2>INCINOLET GIVES YOU:</h2> <span class="bluehead"><span>CONVENIENCE</span></span> - Put INCINOLET wherever you need it as the main toilet in your home, cabin, houseboat or as an additional toilet in the basement, barn or poolside. INCINOLET is compact enough to go almost anywhere! <div class="just"> <p><span class="bluehead">EFFICIENCY</span> - INCINOLET uses electric energy efficiently - demands power only after its use and may remain unused for months without ill effect.</p> </div> <div class="just"> <span class="bluehead">QUALITY</span> - INCINOLET is built of stainless steel and uses highest quality controls for long life and ease of maintenance</div> <div class="just"> </div> </div> </td> <td valign="top" width="149"> <div class="img_spacer"> <img src="media/incinolet.jpg" alt="" width="249" height="325" border="0" /></div> </td> </tr> </table> </div> <p></p> <div class="footer"> <p>site design by side effects - all materials ©2009 Incinolet</p> </div> </div> </div> </body> I get 4 validation errors, but being a bit of a newb, I don't know if they are affecting the links: # Error Line 70, Column 8: end tag for "div" omitted, but OMITTAG NO was specified </body> You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">". # Info Line 20, Column 2: start tag was here <div id="wrapper"> # Error Line 70, Column 8: XML Parsing Error: Opening and ending tag mismatch: div line 20 and body </body> # Error Line 72, Column 7: XML Parsing Error: Opening and ending tag mismatch: body line 19 and html </html> # Error Line 72, Column 7: XML Parsing Error: Premature end of data in tag html line 3 </html> and lastly, here is the CSS for the menu: #tabs { width:100%; font-size:105%; line-height:normal; border-bottom:1px solid #666; margin-bottom:1em; /*margin between menu and rest of page*/ overflow:hidden; float: left; } #tabs ul { margin:0; padding:10px 10px 0 0px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(../media/left.png) no-repeat left top; margin:0; padding:0 0 0 6px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(../media/right.png) no-repeat right top; padding:6px 15px 4px 6px; margin-right:2px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; } /*menu2*/ #modernbricksmenu2{ padding: 0; width: 100%; border-top: 5px solid #000; /*Brown color theme*/ background: transparent; voice-family: "\"}\""; voice-family: inherit; } #modernbricksmenu2 ul{ margin:0 0 0 100px; padding: 0; list-style: none; } #modernbricksmenu2 li{ display: inline; margin: 0 4px 0 0; padding: 0; text-transform:uppercase; } #modernbricksmenu2 a{ float: left; display: block; font: bold 11px Arial; color: white; text-decoration: none; margin: 0 1px 0 0; /*Margin between each menu item*/ padding: 5px 15px; background-color: #06c; /*Brown color theme*/ border-top: 1px solid #000; } #modernbricksmenu2 a:hover{ background-color: #000; /*Brown color theme*/ color: white; } #modernbricksmenu2 #current a{ /*currently selected tab*/ background-color: #000; /*Brown color theme*/ color: white; border-color: #000; /*Brown color theme*/ } Thanks in advance for any help
June 9, 200917 yr Author Problem solved. Someone pointed out the missing tag. I was missing a </div> tag at the end of the menu. Thanks
Create an account or sign in to comment