Re: Max Width to Fill Screen & Center Menu Buttons

[admin]

Hi,

First a note since you mention Bootstrap – if you are using the Bootstrap add-on the menus will use the Bootstrap theme (whatever it is). The “sm-blue” theme (class) is not supposed to be used in combination with the Bootstrap add-on.

If you are not using the Bootrap add-on, you can center the items of a horizontal main menu with some additional CSS – a sample code is posted in the following discussion:

http://www.smartmenus.org/forums/topic/smartmenu-dropdown-doesnt-work-if-main-menu-is-display-inline

As for taking the full width – a horizontal main menu would take the full width of its container by default since we have the following styles by default on the demo page:

#main-menu {
	position:relative;
	z-index:9999;
	width:auto;
}

So it depends in what container you would put it and if it would have any margin/border/padding applied. Or you could also change its positioning to something like (which would work on the demo page with the “sm-blue” theme but might not work with some specific layout, of course):

#main-menu {
	position:absolute;
	top:0;
	left:0;
	z-index:9999;
	width:100%;
}

Cheers!