0

Have tried a lot of different things, and still having a lot of trouble centring this navbar: http://www.miriammedical.co.uk/miriam2012

If I follow the advice here... Editing Nav Menu - How Do I Wrap display:block, float:left to have a Centered Menu? ... which is to add a fixed with and use margin 0 auto, all that happens is the list appears off-centre.

And then there's this, which suggests using margin-left: auto and margin-right: auto... CSS Issue Centering NavBar ... but the same thing, it's off-centre

There are other tutorials suggesting using float: left, but any time I add floats (to either the list itself, or the list and its container), I either get the list appearing on the very left of the screen, or I just get everything split gaps appearing in the container instead of the list being on one line.

I know this is an oft-covered topic, but the same old advice isn't working for me. I'm obviously missing something, so help would be appreciated. Hopefully some illumination with clarify the core coding issues at play, as opposed to all the other answers on the net, which just seem to make the same basic suggestions. Thanks.

Community
  • 1
  • 1
Ian Mantgani
  • 1
  • give us some code and we will show you that it can be achieve easely with text-align or margin:auto dependent on display. (use jsfiddle.net or codepen.io/pen ) – G-Cyrillus Jul 04 '13 at 12:23

2 Answers2

0

It's not an ultimate solution, but in that specific case it works

ul#nav {
font-size: 12px;
width: 666px;
margin: auto;
alignment-baseline: central;
}

Element which have any width , with margin:auto; will get centered position relatively to it's parent

Pumpkinpro
  • 837
  • 4
  • 5
0

You could use this:

div.navbar_wrapper { text-align: center; }
ul#nav { display: inline-block; width:auto; }
Christian Nesmark
  • 586
  • 2
  • 7
  • Thanks, guys. I used Christian's suggestion and it seems to work a treat. Is there any mess in the code which would be preventing other solutions from working? – Ian Mantgani Jul 08 '13 at 15:49