ThemeShaper Forums » Thematic


menu padding of li items

(4 posts)
  • Started 4 years ago by bhomatude
  • Latest reply from bhomatude
  • This topic is not resolved
  1. bhomatude

    Hard to explain this one but if you have a look at:

    I am trying to solve a problem concerning this:

    .sf-menu a {
    padding:0 77px 0 0;

    I've set padding-right in order to space out the menu items so that they are justified with everything else. The actual width of everything is 675px but if I reduce the width of body and content etc. to 675px, then because of the padding-right of .sf-menu a, the last menu item is forced to break to the left (sorry for improper language!)

    What I'd love to do is either address that specific li ("contact") or figure out how to allow the overflow of the menu to the right. I'm at a loss. Right now it works, but the body is not centered properly in the browser in order to allow for the padding in the menu.

    Any ideas on how to solve my styling with this?

    Posted 4 years ago #
  2. bhomatude

    I would still like to figure this out, but now the client dropped some menu items and I no longer have this problem.

    Posted 4 years ago #
  3. I'm not exactly sure what you are trying to do because the menu changed. But you can always target specific menu items if needed. For instance, if you wanted to change the right padding of your "Contact" menu, you could do:

    .sf-menu a {padding:0;}


    .sf-menu li:last-child a {padding:0;}

    There's probably a more elegant solution to get the container properly sized so you don't need to specifically target the item, but if your menu items aren't going to be changing and you just need a quick fix, that would be a quick way to do it.

    Posted 4 years ago #
  4. bhomatude

    Thanks Devin -- that's exactly what I am trying to do. I'll keep it in mind for the next time!

    Posted 4 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.