html - Why does my menu bar disappear in firefox? -
please help! driving me crazy. menu bar shows fine in chrome not in firefox or cometbird, etc...
i can't seem find problem, i've set whole thing below. help whatsoever appreciated, please don't inconvenience yourself.
html
<div class="content"> <div class="header"> <a href="home.html"><img src="images/index_01.jpg" width="255" height="113" alt=""></a> <div class="login_1"> <a href="#">login</a> </div> <div class="buttons_1"> <ul id="menu"> <li><a href="home.html">home</a> <li><a href="services.html">products & services</a> <li><a href="solutions.html">solutions</a> <ul class="sub-menu"> <li><a href="#"><b>solution list</b><hr></a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">6</a></li> <li><a href="#">7</a></li> </ul> <li><a href="faq.html">faq</a> <li><a href="about us.html">about us</a> <li><a href="contact us.html">contact us</a> </li> </ul> </li> </ul> </div> </div> <div class="bodywrapperp"> <h1>contact information:</h1> <p><b>e-mail:</b> <img src="images/email.png" width="95" height="12">-</p> <p><b>tel:</b>number</p> <p><b>address:</b>goes here</p> <form name="contactform" method="post" action="send_form_email.php"> <table width="940"> <td align="center"><td><h1>e-mail us!</h1></td> </td> <tr> <td width="130" valign="top"> <label for="first_name">first name</label> </td> <td width="auto" valign="top"> <input type="text" name="first_name" maxlength="50" size="30"> </td> </tr> <tr> <td valign="top"> <label for="last_name">last name</label> </td> <td valign="top"> <input type="text" name="last_name" maxlength="50" size="30"> </td> </tr> <tr> <td valign="top"> <label for="email">email address</label> </td> <td valign="top"> <input type="text" name="email" maxlength="80" size="30"> </td> </tr> <tr> <td valign="top"> <label for="comments">comments</label> </td> <td valign="top"> <textarea name="comments" maxlength="1000" cols="97" rows="20"></textarea> </td> </tr> <tr> <td colspan="2" style="text-align:right"> <input type="submit" value="submit"> </td> </tr> </label> </table> </form> </div> <div class="footer2"> <a href="home.html">home</a> | <a href="services.html">products & services</a> | <a href="solutions.html">solutions</a> | <a href="faq.html">faq</a> | <a href="about us.html">about us</a> | <a href="contact us.html">contact us</a> | <a href="#">mobile site</a> | <a href="#">login</a> <br> <a href="terms & conditions.html">terms & conditions</a> | <a href="privacy statement.html">privacy statement</a> </br> </div> </div> css
.content { width:960px; height:auto; /*was 760px */ margin: 0 auto; background-color:#ededed; } .header { background-color:#fff; width:960px; height:114px; } .login_1 { float:right; background-color:#ffe600; width:135px; height:14px; padding:7px; margin-top:-90px; font-family:verdana, geneva, sans-serif; } .buttons_1 { clear:both; color:#5b5b5b; font-family:verdana, geneva, sans-serif; float:right; margin-top:-50px; margin-right:15px; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* drop downwards buttons */ ul#menu, ul#menu ul.sub-menu { padding:0; margin: 0; } ul#menu li, ul#menu ul.sub-menu li { list-style-type: none; display: inline-block; z-index:91; } ul#menu li a, ul#menu li ul.sub-menu li { text-decoration: none; color: #5b5b5b; padding: 5px; display:inline-block; } ul#menu li { position: relative; } /*sub menu*/ ul#menu li ul.sub-menu { display:none; position: absolute; top: 30px; left: 0; width: 150px; background:#fff; margin-top:-5px; font-size:10px; } ul#menu li:hover ul.sub-menu { display:block; } .bodywrapperp { clear:left; background-color:#fff; width:920px; height:auto; margin-top:11px; padding:20px; font-family:verdana, geneva, sans-serif; font-size:12px; color:#333; } .footer2 { background-color:#999999; width:960px; height:auto; font-family:arial, helvetica, sans-serif; color:#5b5b5b; font-size:14px; text-align:center; padding-top:12px; position: relative; bottom: -10px ; padding-bottom:12px; } thanks
remove margin-top:-50px; .buttons_1
demo
html css
No comments:
Post a Comment