placing the menu in a centred div

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:38

placing the menu in a centred div

Poster: y0ur1
Dated: Monday July 18 2005 - 11:23:19 BST

Hi

can anyone help me on this one? the menu's are not posiotioned well. It adds a distance from the left of the screen to the main centred div.

http://www.verenigingclc.nl/nieuw/

thanks

Poster: slackbladder
Dated: Monday July 18 2005 - 12:30:19 BST

Hi,

Try:

changing your CSS to:

Code:

body {
   font-family: verdana;
   font-size: 10pt;
   margin: 0px;
   background: url('../images/achtergrond.gif');

}

div#main{
   width: 770px;
   background: #D3E7D3;
}

div#header {
   background: #810000;
   background-repeat: no-repeat;
   border-bottom: 1px solid #C0C0C0;
   height: 80px;

}

div#menu {   
   height: 21px;
   background: #B90000;
   border-bottom: 1px solid #C0C0C0;
}

div#content {
   float: left;
   width: 547px;
   padding: 10px;
   font-size: 10pt;
}

div#content-right{
   float: left;
   height: 100%;
}

.box-header{
   width: 195px;
   color: #fff;
   margin-top: 10px;
   background: url('../images/box-header.gif');
   height: 15px;
   font-size: 8pt;
   font-weight: bold;
   padding-left: 3px;
   padding-right: 2px;
   padding-top: 2px;
   
}

.box{
   width: 188px;
   text-align: left;
   font-size: 8pt;
   padding: 5px;
   border: 1px solid #6666A6;
   background: #F4FAF4;
   margin-bottom: 10px;
}

div#footer{
   clear: both;
   width: 770px;
   height: 15px;
   background: url('../images/footer.gif');
   overflow: hidden;

}

h3 {
   color: #B90000;   
   margin: 0px;
   font-size: 13pt;
   text-align: right;
}

h5 {
   color: #B90000;   
   margin-bottom: -8px;
   font-size: 10pt;
   font-weight; none;
}

hr {
   height: 1px;
   border-style: none;
   color: #6666A6;
   background-color: #6666A6;
   margin-top: 5px;
   margin-bottom: 0px;
}

p {
   margin-top: 10px;
}

a {
   text-decoration: none;
   color: #B90000;
}

a:hover{
   text-decoration: underline;
}

div.container  { text-align: left; margin: 0 auto; width: 770px }

table#maintable {
   width: 100%;
}

changing your menu_data.php to:

Code:

_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out 
_menuOpenDelay=0 // The time delay before menus open on mouse over 
_subOffsetTop=0 // Sub menu top offset 
_subOffsetLeft=0 // Sub menu left offset 

with(menuStyle=new mm_style()){ 
onbgcolor="#6666A6"; 
oncolor="#fff"; 
offbgcolor="#B90000"; 
offcolor="#fff"; 
bordercolor="#C0C0C0"; 
borderstyle="solid"; 
borderwidth=1; 
separatorcolor="#C0C0C0"; 
separatorsize="1"; 
padding=4; 
fontsize="8pt"; 
fontstyle="normal"; 
fontweight="normal"; 
fontfamily="Verdana, Tahoma, Arial"; 
pagecolor="white"; 
pagebgcolor="#B90000"; 
headercolor="#000000";
headerbgcolor="#ffffff"; 
subimage="./includes/milonic/arrow.gif"; 
subimagepadding="2"; 
} 

with(milonic=new menuname("Main Menu")){ 
style=menuStyle; 
top=80;  
alwaysvisible=1; 
orientation="horizontal"; 
aI("text=Home;url=index.php;status=Back To Home Page;"); 
aI("text=Vereniging CLC;showmenu=6;"); 
aI("text=Nieuws & Publicatie's;showmenu=2;"); 
aI("text=Coaches & Counselors;showmenu=3;"); 
aI("text=Ledennet;showmenu=4;"); 

aI("text=Links;url=;status=Back To Home Page;"); 
aI("text=Contact;url=contact.php;status=Back To Home Page;"); 
} 

with(milonic=new menuname("8")){ 
style=menuStyle; 
overflow="scroll"; 
} 

with(milonic=new menuname("6")){ 
style=menuStyle; 
overflow="scroll"; 
aI("text=• lidmaatschap;url=index.php?page=9;"); 
aI("text=• statuten;url=index.php?page=10;"); 
aI("text=• huishoudelijk reglementen;url=index.php?page=11;"); 
} 

with(milonic=new menuname("2")){ 
style=menuStyle; 
overflow="scroll"; 
aI("text=• agenda;url=index.php?page=12;"); 
aI("text=• activiteiten;url=index.php?page=13;"); 
aI("text=• de loper;url=index.php?page=14;"); 
} 

with(milonic=new menuname("3")){ 
style=menuStyle; 
overflow="scroll"; 
aI("text=• kopstukken;url=index.php?page=15;"); 
aI("text=• zoeken op postcode;url=index.php?page=16;"); 
} 

with(milonic=new menuname("4")){ 
style=menuStyle; 
overflow="scroll"; 
aI("text=• inloggen;url=login.php;"); 
aI("text=• exclusief;url=index.php?page=18;"); 
} 

with(milonic=new menuname("19")){ 
style=menuStyle; 
overflow="scroll"; 
} 

with(milonic=new menuname("5")){ 
style=menuStyle; 
overflow="scroll"; 
} 

drawMenus(); 

All I did was change your CSS def div.container (removed relative position - I don't know enough about css to know how this will affect the rest of the site?) and removed the left=0; from your menu_data.php

Note: Your site doesn't work properly on MAC IE5.2 (but there's not many using it anyway)!

Poster: y0ur1
Dated: Monday July 18 2005 - 13:34:52 BST

I solved the problem by using a table instead of a div. Can you check whether this works on an mac?

http://www.webintellect.nl/projects/clc/

Poster: slackbladder
Dated: Monday July 18 2005 - 13:42:40 BST

Looks cool in FireFox and Safari (MAC) but in IE it's all over the place. Check out this:

http://www.milonic.com/menufaq.php#mactrouble

but bare in mind - IE is no longer being supported for MAC (no upgrades) - Microsoft believe Apple can do a better job :lol:

(I won't disagree with them!). So most MACs users use FF or Safari

Poster: Ruth
Dated: Monday July 18 2005 - 14:21:03 BST

Hi,

Slack is correct on the IE Mac, but also remember that even though it's not supported many will not upgrade to something else, just look at those who still use Netscape4x browsers!

Just remove the main menu from the data file per directions and it takes care of that problem.

Code:

<TABLE id=maintable cellSpacing=0 cellPadding=0>
  <TBODY>
  <TR>
    <TD>&nbsp;</TD>
    <TD width=770>
     <SCRIPT type=text/javascript>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
orientation="horizontal";
position= "relative";
aI("text=Home;url=index.php;status=Back To Home Page;");
aI("text=Vereniging CLC;showmenu=6;");
aI("text=Nieuws & Publicatie's;showmenu=2;");
aI("text=Coaches & Counselors;showmenu=3;");
aI("text=Ledennet;showmenu=4;");
aI("text=Links;url=;status=Back To Home Page;");
aI("text=Contact;url=contact.php;status=Back To Home Page;");
}
drawMenus();
</script>
    </TD>
    <TD>&nbsp;</TD></TR></TBODY></TABLE>

Ruth

Industrial Strength JavaScript and DHTML Menus

placing the menu in a centred div