Toolbox theme – modify css to verticla menu

  • Unknown's avatar
    lindemulder · Member ·

    Hello,

    I have some experience with css (also maintain 5 wordpress blogs). Downloaded a copy of Toolbox theme and I am working on modifying the css on my computer. In other words I do not have a sample to look at online. (It is for nicholasgoebel.com, which is plain old Toolbox at the moment.)

    Here is what I am wondering. The css file that belongs to Toolbox contains the following:

    /* =Menu
    ————————————————————– */

    #access {
    background: #eee;
    display: block;
    float: left;
    margin: 0 auto 1em;
    width: 100%;
    }
    #access ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    }
    #access li {
    float: left;
    position: relative;
    }
    #access a {
    display: block;
    line-height: 2em;
    padding: 0 1em;
    text-decoration: none;
    }
    #access ul ul {
    box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    display: none;
    float: left;
    position: absolute;
    top: 2em;
    left: 0;
    z-index: 99999;
    }
    #access ul ul ul {
    left: 100%;
    top: 0;
    }
    #access ul ul a {
    background: #dedede;
    line-height: 1em;
    padding: .5em .5em .5em 1em;
    width: 10em;
    height: auto;
    }
    #access li:hover > a,
    #access ul ul :hover > a {
    background: #dedede;
    }
    #access ul ul a:hover {
    background: #cecece;
    }
    #access ul li:hover > ul {
    display: block;
    }

    And the portion of the Toolbox page it is refering to:
    <nav id=”access” role=”navigation”>
    <h1 class=”section-heading”>Main menu</h1>
    <div class=”skip-link screen-reader-text”>Skip to content</div>

    <div class=”menu”>

      <li class=”current_page_item”>Home
      <li class=”page_item page-item-2″>About

    </div>
    <!– #access –>

    Because I am not an expert I am hesitant about a couple of things with this menu.
    What states are the following referencing? (I understand the ‘hover’ and ‘a’ references):
    #access ul ul
    #access ul ul ul
    #access ul ul a
    #access li:hover > a,
    #access ul ul :hover > a
    #access ul li:hover > ul

    Is the “section-heading” hidden in a global css file?

    And what does the following create?:
    box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);

    I will be altering the menu so that it is vertical as opposed to horizontal.

    Hope you can help,
    J

  • Unknown's avatar
    supportbot · Member ·

    You did not specify a blog address or reason for posting when you created this topic.

    This support forum is for blogs hosted at WordPress.com. If your question is about a self-hosted WordPress blog then you’ll find help at the WordPress.org forums.

    If you don’t understand the difference between WordPress.com and WordPress.org, you may find this information helpful.

    If you forgot to include a link to your blog, you can reply and include it below. It’ll help people to answer your question.

    This is an automated message.

  • Unknown's avatar
    lindemulder · Member ·

    Yes, mister bot, I understand the difference, and as I posted in my post it is for nicholasgoebel.com, but it won’t make much difference to send people there unless they would like to look at the plain Toolbox theme. ; )

  • Unknown's avatar
    thesacredpath · Member ·

    The toolbox theme here has been modified from the original. There is a lot of stuff added to support features that are unique to here and quite probably stuff that has been taken out, and only two of us in these forums with CSS experience, and about all I can do at the moment is spell toolbox. I helped one person here with a couple small things, but past that I’ve done virtually nothing with it other than load the blank onto one of my test blogs.

    It is much more likely that the people over at .ORG have messed with it than the two of us here.

  • Unknown's avatar
    lindemulder · Member ·

    Thank you thesacredpath. I will see if I can find any answers over there. And happy New Year!

    J

  • Unknown's avatar
    thesacredpath · Member ·

    You’re welcome and Happy New Year to you as well.

  • The topic ‘Toolbox theme – modify css to verticla menu’ is closed to new replies.