0

I have been to the end of the internet and back trying to solve this. Here is the page withe the spry menu. You will notice some inline styling to get it to fit the design of 980px wide. The HTML

Here is the spry CSS.

    [CSS][2]
user1492245
  • 3
  • 1

1 Answers1

0

I set this in firebug:

ul.MenuBarHorizontal {
    width: 1200px;
}

Which shows the navigation menu is wider than 980, which is why it is wrapping around. You need to strip off five or ten pixels from the padding or margins of your menu items.

ul.MenuBarHorizontal a {
    padding: 9px 20px;
}

Seems to work well. And actually, you can take that second padding value up to 26px without it wrapping around.

dezman
  • 18,087
  • 10
  • 53
  • 91
  • Thanks for the quick response and the help. This helps to keep the contact box from wrapping unless you zoom out a few times. It doesn't keep the edge of the menu flush with the edge of the page though if you zoom in or out at all. This spry thing is killing me. – user1492245 Jun 29 '12 at 22:47
  • You need to add a few pixels somewhere in the menu to make it flush with the rest of the page. Since ul.MenuBarHorizontal a targets all of them at once it is not good for this. You should give the contact link a class of last and add some padding-right to make it flush. – dezman Jun 29 '12 at 22:51