WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Twenty Ten Theme Menu Item Width (CSS help) (2 posts)

  1. tommygeorge
    Member
    Posted 4 years ago #

    I can't seem to wrap my head around this. I'm working with the new Twenty Ten theme in WordPress 3 (beta/nightly).

    I'd prefer the sub-menus expand to the width of whatever is in them.

    I have removed the "width" declaration from "#access ul ul a {}" style, but the menus seem to shrink further (the uneven backgrounds I know how to fix, in that case).

    I have also tried changing the same "width" to "min-width", which doesn't seem to do it either.

    I've set up an example that contains nothing but an extremely bare-bones set of HTML, along with the Twenty Ten CSS file, for working with this menu issue.

    I can't seem to find what's constricting the width of the ULs/LIs in the sub-menus.

    Any hints/tips?

    Thanks!

    Example page: http://almostexciting.com/wordpress-twentyten-menu.html

  2. tommygeorge
    Member
    Posted 4 years ago #

    RESOLVED:

    Just change the styles to reflect below, or simply add at the end of the style.css / in a custom stylesheet:

    #access ul ul a { min-width: 130px; white-space: nowrap;}
    #access .menu-header ul, div.menu ul {background-color: #333;}

    Setting the background color on the ULs because otherwise the shorter list items would look silly. Not sure why the original code doesn't do this anyway. The main thing here is setting white-space, which appears to work just fine in IE7, haven't been able to try IE6. FF3 is fine.

Topic Closed

This topic has been closed to new replies.

About this Topic