Jump to content

submenu does align with main text


hoachen

Recommended Posts

I have trouble align the text with the submenu text beneath it. I followed the example at www.w3schools.com/dhtml/ tryit.asp?filename=trydhtml_menu10. but my is not align beneath the submenu it slightly toward to the right site. If i put in the left: some pixel tag. Then, at different brower will have different position. I want the submenu position will be exact where it is even the user have different screen resolution. The example at above link did that but when add-in the tage: left:300px then the position will change when have different browser. Please give some advice for this. I really need to get this work!Thanks and thank you for reading this question.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><script language="javascript">function showmenu(elmnt){document.getElementById(elmnt).style.visibility="visible"}function hidemenu(elmnt){document.getElementById(elmnt).style.visibility="hidden"}</script><style>table{font-size:80%;background:black}a{color:black;text-decoration:none;font:bold}a:hover{color:#00FF00}td.menu{background:lightblue}table.menu{ font-size:110%; position:absolute; visibility:hidden; text-align:left; display: block; font-family: Arial, Helvetica, sans-serif; text-decoration: none; font: 12px; background-color: #FFFFFF; left: auto; }</style></head><body><table width="914" border="0" align="center" cellpadding="0" cellspacing="0" class="bg"> <!--DWLayoutTable--> <tr> <td width="331" rowspan="2" scope="col"><img src="../images/topbar_name.jpg" width="331" height="135"></td> <td height="46" scope="col"> <table width="100%"border="0" cellpadding="0" cellspacing="0" height="46" align="right"> <tr bgcolor="#FFFFFF" align="center"> <td width="14%" class="nav" onmouseover="showmenu('home')" onmouseout="hidemenu('home')"><a href="/default.asp">HOME</a><br /> <table class="menu" id="home" width="120"> <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr> <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr> <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr> <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr> <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr> </table> </td> <td width="1%"><img src="images/nav_border.jpg"></td> <td width="14%" class="nav" onmouseover="showmenu('company')" onmouseout="hidemenu('company')"><a href="/default.asp">OUR COMPANY</a><br /> <table class="menu" id="company" width="120"> <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr> <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr> <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr> <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr> <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr> </table> </td> <td width="1%"><img src="images/nav_border.jpg"></td> <td width="14%" class="nav" onmouseover="showmenu('investor')" onmouseout="hidemenu('investor')"><a href="/default.asp">INVESTOR</a><br /> <table class="menu" id="investor" width="120"> <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr> <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr> <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr> <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr> <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr> </table> </td> <td width="1%"><img src="images/nav_border.jpg"></td> <td width="14%" class="nav" onmouseover="showmenu('newsroom')" onmouseout="hidemenu('newsroom')"><a href="/default.asp">NEwsroom</a><br /> <table class="menu" id="newsroom" width="120"> <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr> <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr> <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr> <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr> <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr> </table> </td> <td width="1%"><img src="images/nav_border.jpg"></td> <td width="14%" class="nav" onmouseover="showmenu('property')" onmouseout="hidemenu('property')"><a href="/default.asp">Property</a><br /> <table class="menu" id="property" width="120"> <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr> <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr> <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr> <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr> <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr> </table> </td> <td width="1%"><img src="images/nav_border.jpg"></td> <td width="14%" class="nav">CONTACT US</td> </tr> </table></td> </tr> <tr> <td height="89" valign="top"><img src="images/topbar_email.jpg" width="583" height="89"></td> </tr> <tr> <td height="19" colspan="2" scope="col">contents</td> </tr> <tr> <td height="19" colspan="2" scope="col"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td scope="col"><img src="../images/bottom.jpg"></td> </tr></table></td> </tr></table></body></html>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...