NAV Bar Centrailed Issue

Question

I have tried all not coming in centralized given with screen detect navbar also

#navcontainer { 
    margin: 0 auto; 
    width: 100%; 
    height: 44px; 
}
.menu { 
    font-size: 13px; 
    color: #000; 
    z-index: 1001; 
    margin: 0px; 
    position: absolute;  
    z-index: 30; font-family: Verdana, Arial, Helvetica, sans-serif;
}
.menu ul { 
    margin: 12px 0 0 0px;
}
.menu ul li { 
    float: left;
}
.menu .part01 { 
    width: 400px; 
    margin: 10px 0 0 70px; 
    float: left;
}
.menu .part02 { 
    margin: 10px 0 0 695px; 
    width: 400px;
}

This is My Website

enter image description here

Dude, u have attached a img, where in it is not centralized, but in the link you have provided, looks Ok, so i am not clear about your requirement, can you please explain in points — RONE, Jul 15 '13 at 07:49

score 0 · Answer 1 · answered Jul 15 '13 at 08:08

Make your menu navigation as one single block of UL LI list, compared to current which is broken into 2 UL list and Logo is placed in between.

Once you have all inside one container you can make this menu responsive, adding with to the parent container and adding style margin: 0 auto; which I can see you already have.

You code should look something like this:

<div id="menu" style="width:80%; margin: 0 auto;">
<ul>
<li>Item x...</li>
<li>Item x...</li>
<li>Item x...</li>
<li class="logo"></li>
<li>Item x...</li>
<li>Item x...</li>
<li>Item x...</li>
</ul>
</div>

@SAM it only breaks on different resolutions also if you manually re-size the browser window — Sunil Kumar, Jul 15 '13 at 08:10

score 0 · Answer 2 · answered Jul 15 '13 at 08:15

You need to change the following :

.index_container {
    display: block;
    margin: 45px auto 0;
    min-height: 450px;
    width: 100%;
}

.slideshow {
    margin: 0 auto;
    width: 950px;
}

.span-25 {
    margin: 0 auto;
    padding: 0;
    width: 1105px;
}

This removes the float:left; on the slides holder, and keeps them centered in their container, which in turn is kept centered in its container, which is 100% wide. This is the same layout as your menu, so they now match.

NAV Bar Centrailed Issue

2 Answers2