Div Trouble

[RabBellv1]

Ok this is a unique problem and a complete pain in the neck

What I'm trying to do is display an image in a table column and then using div's (or if someone knows a better way I'll listen) to position a menu over the image. Here's the code...

<table align="center" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" rowspan="4">
<div style="position: relative"><img src="images/toolbarframe_logoinc.jpg" border="0" usemap="#logomap"><div class="positionmenudiv">
<ul class="toolbarstyle">
<li><a href="" accesskey="1" title="WELCOME">WELCOME</a></li>
<li><a accesskey="2" title="ABOUT US" href="">ABOUT US</a></li>
<li><a accesskey="3" title="PRODUCTS" href="">PRODUCTS</a></li>
<li><a accesskey="4" title="FIXED INCOME" href="">FIXED INCOME</a></li>
<li><a accesskey="5" title="EQUITIES" href="">EQUITIES</a></li>
<li><a accesskey="6" title="ETHICIAL" href="">ETHICIAL</a></li>
<li><a accesskey="7" title="PRICES" href="">PRICES</a></li>
<li><font title="CONTACT US">CONTACT US</font></li>
<li><a accesskey="9" title="LINKS" href="">LINKS</a></li>
<li><a accesskey="10" title="IMPORTANT INFORMATION" href="">IMPORTANT INFORMATION</a></li>
<li><a accesskey="11" title="FOR IFAS" class="li_biggerlinks" href="">FOR IFAS</a></li>
</ul></div></div></td>
</tr></table>

you can see I've placed a div and gave it a relative position and then the image for the column and then another div with these settings

.positionmenudiv{
position:absolute;
left:5px;
top:140px;
}

and the menu is then displayed over the image just how I want it :beam:.....almost

In Mozilla if I give the set the CSS settings to

.positionmenudiv{
position:absolute;
left:0px;
top:0px;
}

then the menu is shown in the top left hand corner of the column. However in IE it's shown in the top center of the column. I then have to change the left settings to -20 to get it in the top corner but then in Mozilla the menu is -20 pixels outside the table.....

any ideas?

 

[tgreer]

Could you create your menu as an element, and then give that element a "background" property? That way everything, the text and the image, are applied to a single element, eliminating the need to overlap/position separate elements.



Thomas D. Greer

http://www.tgreer.com

Providing PostScript & PDF
Training, Development & Consulting

 

[Olavxxx]

How can you have accesskey=11 and accesskey=10?

if you have more than one of a number, it will go thru them, by repeating the key-tap.

eg. accesskey=1 can be used for several elements..

I built a tree-like structure in my CMS, where the child has the accesskey of the parent, and the parent looses it's href, when it's active.

ps. I didnt style that menu yet, but on another page, I didnt use lists, but simply made CSS box and positioned them nicely horizontal.

Olav Alexander Mjelde

http://www.volvo-power.net

Admin & Webmaster