Centering Menu Items (Squirrel Theme)

  • RHemingway

    (@rhemingway)


    11 years, 5 months ago

    Hi all,

    I am trying to center the menu items in the Squirrel website theme at wholesale used books.

    I removed the float: left attriubute but still can’t seem to center it.

    CSS is as follows:

    .menu_wrapper {
    margin-bottom:0;
    }
    #menu {
    position:relative;
    z-index:99;
    }
    #menu li {
    list-style-type:none;
    }
    #menu li a {
    font-size:13px;
    margin:0;
    padding:3px 8px;
    position:relative;
    color: #fff;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    }

    Thanks for your help!

    Richard

Viewing 5 replies - 1 through 5 (of 5 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 5 months ago

    Consider this article on Centering Things, but generally CSS support this specific is not supported from WordPress forums and ought to be asked in CSS-specific forums.

    Thread Starter RHemingway

    (@rhemingway)

    11 years, 5 months ago

    Thanks for this Andrew,

    Have attempted to implement some changes based on the CSS article but no joy at present.

    I had seen a few other posts on the forums before posting this one covering similar problems, but none of the suggestions worked for me.

    Ivo Delin

    (@ivo-delin)

    11 years, 5 months ago

    #menu {
    text-align: center;
    }
    #menu li {
    float: none;
    display: inline;
    }

    Thread Starter RHemingway

    (@rhemingway)

    11 years, 5 months ago

    Thanks Ivo,

    Afraid that didn’t work.

    It changed the text to black & all items in the dropdown displayed as bullet points. All remained aligned to the left.

    WPyogi

    (@wpyogi)

    11 years, 5 months ago

    There’s not an easy or simple way to do what you want — probably the best way, unless you want to do major recoding of that section of the page, is to change the padding-left in this CSS:

    #menu .ddsmoothmenu {
    background: none repeat scroll 0 0 #373737;
    float: left;
    padding-bottom: 5px;
    padding-left: 150px;
    width: 950px;

    You’ll have to adjust it if you add any other menu items. It’s also not recommended to make changes in any theme files — but to rather use a child theme or custom CSS option or plug-in.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Centering Menu Items (Squirrel Theme)’ is closed to new replies.

Tags