Moderator
t-p
(@t-p)
looks like the second row (Random shorts) is pushing the nav upwards. If you remove it or reduce your Nav to just one row (i.e., place all items in one row – by reducing padding between the Nav items from 10px to 8px for both left and right padding property), then all appears to be in ceneter.
That still doesn’t solve the centering problem. The official site will not have as many links but I still want the Nav bar to be centered and only fit 100% of the links without extra graphic on the side.
Moderator
t-p
(@t-p)
in FF it looked pretty centered with one row
I have setup my main site with it as an example.
http://www.diskrete.com
Moderator
t-p
(@t-p)
looks great!
when your “center”, are you refering to center vertically or horizontally?
Centering the group of menu items horizontally across the nav bar.
Moderator
t-p
(@t-p)
ok
look for the element:
ul .navigation li a {
Add this property to that element:
margin-left: 60px;
play with 60px figure until you like it.
So I’m going to have to push the margin 60 since they cant be centered? trying….
Thanks
Hmm. That didn’t do it. Should I remove any lines in that element before adding that statement?
Moderator
t-p
(@t-p)
yes, that will push it approximately to the center.
That is pushing the individual box margins over 60px.
For the Diskrete website try making these changes to style.css
line 117 – ul.navigation
text-align: center;
display: inline;
Line 118 ul.navigation li
float: none;
display: inline;
Line 119 ul.navigation ul a
display: inline;
Line 124 ul.navigation li a span.title
display: inline;
You will have to remove or compress the menu items as there are too many to fit in the space, but the above should centre the entries.
