Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:41

Centered layout, left-hand menu not in centered portion


Poster: davebarnes
Dated: Thursday February 15 2007 - 16:54:51 GMT

On this page:
http://www.dataprotectionsummit.com/Eng ... ister.html
I am using a div to center the page in the browser.
However, the Milonic Menu is shoved all the way to the left-hand side of the browser window.
I have read the documentation and searched this forum; all to no avail.

What do I change?

thanks,
dave


Poster: Ruth
Dated: Thursday February 15 2007 - 18:31:44 GMT

Hi Dave,

You are telling it to be at left=0;


Code:
with(milonic=new menuname("Main_Menu")){
style=MainMenuStyle;
top=240;
left=0;
alwaysvisible=1;
orientation="vertical";



If you're putting the menu in a div then you need to position it relatively,
like you do in a table so it will move where you want it.

http://www.milonic.com/tablemenu.php

Ruth


Poster: Ruth
Dated: Thursday February 15 2007 - 20:07:56 GMT

Hi Dave,

I have done your page with a fix for what you want but I thought I'd better provide a more detailed explanation.

In order to do what you want, you really need to use a centering code for the div which will keep it centered all the time, and then place the menu in the table cell. Now, the easiest way to do that is to use center tags around the whole container div, and that seems to work in what I could test. It will allow you to keep your layout sized as is, though you should know that it causes scroll bars at the bottom for anyone with 800x600 resolution.

There is also a centering setup for use with fixed width divs that will keep the layout centered. But, there is a problem using such codes and that has to do with the setting of a negative left margin which is necessary in order for it to center and remain centered at various resolutions. I have a layout that works at 800x600, 1024x768, 1152x864 and 1280x1024 which is the highest resolution I can test on my computer. But, it does require some changes in your layout, not layout changes per se, but size changes since 800x600 is really not 800 wide. On most browsers set to that resolution you get a horizontal scroll bar and since the negative margin for centering is set at half the width, the 800 width of your tables causes the negative margin of -400 to put the left side partway unveiwable. The space for 800 resolution is more like 760 to 770 width for most browsers. Either you have to change your table from 800 to 760 or you have to change the negative left margin to less than 400. If you do that, it means the layout doesn't center at higher resolutions, since it requires that the left margin be 1/2 of the width of the layout.

Here is the page, and you'll see the size changes I made

LINK REMOVED

and the code in the css file for your container is now

Code:
#Container {
   MARGIN-TOP: 0px; DISPLAY: block; position: absolute;
    left: 50%;
    width: 770px;
    margin-left: -385px;
   BACKGROUND-COLOR: white; TEXT-ALIGN: left
}


Poster: Ruth
Dated: Friday February 23 2007 - 18:56:01 GMT

Hi Dave,

Did you get this information, so I can remove your page from my site?

Ruth