Making navigation span width of allocated area

[rebecca]

Hi,

I was wondering if anyone could help me figure out how to make my navigation span the full width of the allocated area? I’ve tried to figure out how to target it and can’t figure it out, so any help is greatly appreciated!

Link to site:
http://axax1678.staging-cloud.netregistry.net/home/

[rebecca]

Sorry, I mean the text to be evenly spaced along the grey bar.

[Paulie_D]

You have a lot of padding on the links

ul#main-nav li a {
  padding: 1em 3.1em !important;
}

The principal reason I suspect is because your menu is floated with the fl class.

If you remove that the menu uncollapses and becomes 100% wide.

If you need the list items equal, you could just make the li 20% wide (100% / no. of list items) and adjust as required.

[Paulie_D]

If you will always have 6 menu items,

I must have miscounted.

Or we could go the display:table / dispay:table-cell route.

http://codepen.io/Paulie-D/pen/QbWWrv/

[Author]

Posts