Centre menu on layer for wide screens

center on regular screen but too left on wide screen

[ozstar]

HI,

I have a dynamic menu on a page which shows up center on regular screens but really to the left on wide screens.

How can I centre this dynamic menu for the newer wide screens so it still shows centre as well as the regular screens?

See here [1300rentbuy.com...]

From source..

<div id="Layer1" style="position:absolute; left:120px; top:213px; width:600px; height:200px; z-index:2">

Thanks


oz

[webprutser]

Positioning of div's has still many secrets for me, so I am not the one with the problem-solving answer.
Since I'm interested in it, as I want to switch from table-layout to box-model, I was wondering if you could centre a absolute positioned element. Obviously this is possible, I found a thread on this forum, which might help you with your question: [webmasterworld.com...]

Generally spoken, I looked at your website and did an "inspect this element" using firebug. Despite your align="centre" at a lot of places, the elements I inspected were specified as to having no CSS rules. It might help to have a look at the way you use style-rules for your website and put it in a separate CSS file.

[ozstar]

Thanks.

It seems I can approach this in two ways..

Which would be the best way to do it?

1. Re-ordering the code in html and applying css.
or
2. Applying javascript

Thanks

[webprutser]

My own rule is: if something can be done with html/css without using javascript, I don't use javascript. I tried some things with javascript myself and ran into certain problems. I have a brother, who is an experienced programmer and he is not very enthusiastic about javascript. He advised me not to use it unless I really can't do without it. This doesn't mean all is wrong with it, but I managed to do without it up till now.
Using javascript for centering things seems unnecessary to me, so in this case I'd take care of html/css. You can validate your code [validator.w3.org...] once you have reorganised it and see what happens. You used align=center in tables and td. I remember having problem with that too.
A div is a better place to give directions for centering. Give it a class or id and put the specifications in your style-sheet. By using firebugs inspection of an element, you can see if the style rules are working the way you want and if you still have problems you have good information as to what part is causing problems.

[ozstar]

Yes finally got a javascript to center this for all screens with a line to change screen res if one comes along where it is not centered.

[tangor]

Happy there's a result, just realize that the growing number of visitors arriving with javascript turned OFF they won't see the "center" and, unless your page is coded to degrade gracefully, might not find the site usable at all.

Best bet is to find a standard HTML/CSS method if you want EVERYONE to use your site.

[TenTonJim]

set the left position to 50% then a negative left margin of half the width of the menu: <div id="Layer1" style="position:absolute; left:50%; top:213px; width:600px; margin-left:-300px; height:200px; z-index:2">

[rocknbil]

Try setting position: relative on the parent container of the absolutely positioned menus. This should keep them contained wherever it is resized.