Jump to content

Dropdown Menu Positioned Wrongly In Ie


Recommended Posts

Hey so I can't figure out why my drop down menu, which I coded from w3schools format, is okay in firefox but not IE7. If you look at www.saradavismiller.com you'll see the drop down menus for 3 of the tabs STARTS in the midde of the button rather than the left side of it in IE. I've tried so many random things, including specifying left:300px to tell it exactly where to go but then realized that wont' work in different resolutions.This should be simple enough, but of course IE doesn't make life simple....The CSS - I think the only thing affecting is the table.dropmenu {position: absolute} - everything else I could delete and it was still positioned weirdly.

body		{		background-color:#132769;		text-align: center;		font-family: Georgia, Verdana, Arial;		color:black;		}table.welcome	{		background-image:url(Indextextbox.jpg);		background-repeat: no-repeat;		}table.realestate {		background-image:url(Realestatetextbox.jpg);		background-repeat: no-repeat;		}table.body	{		background-image:url(textbody.jpg);		}table.dropmenu	{		position: absolute;		visibility: hidden;		background-color: #a6a6a9;		text-align: center;		}td.menu		{		font-size: medium;		font-weight: bold;		}a.dropmenu	{		font-family: Goudy Old Style, Centaur, Georgia, Arial;		color: black;		text-decoration: none;		}a.dropmenu:link {color: black;}a.dropmenu:visited {color: black;}a.dropmenu:hover {color: #535356;}a.dropmenu:active {color: black;}h4		{		text-align: black;		}table.bottom	{		font-size: 11px;		color: white;		}a.bottom:link 		{color: white;			font-weight: bold;			font-size: 11px;}a.bottom:visited 	{color: white;			font-weight: bold;			font-size: 11px;}a.bottom:hover 		{color: white;			font-weight: bold;			text-decoration: none;			font-size: 11px;}a.bottom:active 	{color: white;			font-weight: bold;			font-size: 11px;}div.posted	{		font-size:12px;		text-align: center;		}img.padding	{		padding: 10px;		}

And the html....

<table cellspacing="0" cellpadding="0" border="0" width="950" align="center"><tr><td align="center" width="950">	<img border="0" src="banner1.jpg" /></td></tr><tr><td align="center">	<table id="Table_01" width="950" height="100" border="0" cellpadding="0" cellspacing="0">		<tr><td>			<img border="0" src="images/buttons_01.gif" width="50" height="53" alt=""></td>		<td>			<a href="index.html"><img border="0" src="images/buttons_02.gif" width="132" height="53" alt=""></a></td>		<td onmouseover="showmenu('mission')" onmouseout="hidemenu('mission')">			<a href="missionstatement.html"><img border="0" src="images/buttons_03.gif" width="213" height="53" alt=""></a><br />			<table border="0" class="dropmenu" id="mission" width="170">			<tr><td class="menu">				<a class="dropmenu" href="missionstatement.html#MissionStatement">Mission Statement</a></td></tr>			<tr><td class="menu">				<a class="dropmenu" href="missionstatement.html#CareerHighlights">Career Highlights</a></td></tr>			</table>		</td>

Thanks for helping

Edited by sab17
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...