CSS Trouble

This topic is: not resolved

This topic contains 6 replies, has 2 voices, and was last updated by  David Neff 1 year, 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #44630

    David Neff
    Participant
    Post count: 48

    Hello,

    I am creating a child theme and am having some trouble with the multi-level navigation menu. Here is a screenshot of what happens

    http://davidneff.biz/wp-content/uploads/2013/06/CSS-Problem.jpg

    thttp://davidneff.biz/wp-content/uploads/2013/06/css-problem-2.jpg

    Even worse for grandchild pages

    http://davidneff.biz/wp-content/uploads/2013/06/grandchild.jpg

    I want the levels to align properly.

    Also, when using the Genesis Featured Post Widget with thumnail aligned to the left, it does not align to the left or to the right

    http://davidneff.biz/wp-content/uploads/2013/06/widget.jpg

    What is the problem?

    #44644

    David Neff
    Participant
    Post count: 48

    Here is the CSS code of the navigation menu in question

    #nav {

    background-color: #282828;
    clear: both;
    overflow: hidden;
    }

    #nav .wrap {
    color: #999;
    margin: 0 auto;
    text-transform: uppercase;
    width: 960px;
    }

    #nav ul {
    float: left;
    width: 100%;
    }

    #nav li {
    float: left;
    list-style-type: none;
    border-right: 1px solid white;
    }

    #nav li a {
    color: #999;
    display: block;
    font-size: 12px;
    padding: 7px 15px 6px;
    position: relative;
    text-decoration: none;
    }

    #nav li a:hover,
    #nav li a:active,
    #nav .current_page_item a,
    #nav .current-cat a,
    #nav .current-menu-item a {
    color: #FFF;
    text-decoration:underline;
    }

    #nav li li a,
    #nav li li a:link,
    #nav li li a:visited {
    background-color: #1F3D59;
    border: 1px solid #444;
    border-top-width: 0;
    color: #999;
    font-size: 11px;
    padding: 5px 10px;
    position: relative;
    text-transform: none;
    width: 128px;
    }

    #nav li li a:hover,
    #nav li li a:active {
    color: #FFF;
    }

    #nav li ul{
    height: auto;
    left: -9999px;
    margin: 0 0 0 -1px;
    position: absolute;
    width: 150px;
    z-index: 9999;
    }

    #nav li ul a {
    width: 130px;
    }

    #nav li ul ul {
    margin: -33px 0 0 149px;
    }

    #nav li:hover>ul,
    #nav li.sfHover ul {
    left: auto;
    }

    • This reply was modified 1 year, 3 months ago by  David Neff.
    • This reply was modified 1 year, 3 months ago by  David Neff.
    #44675

    David Neff
    Participant
    Post count: 48

    And this is a demo link to what I have thus far for those using firebug http://projects.davidneff.biz/wp-epic/

    #44814

    David Neff
    Participant
    Post count: 48

    Anyone?

    #44909

    David Neff
    Participant
    Post count: 48

    Can someone pleeeeeeeeeeeease help???

    #44934

    nutsandbolts
    Moderator
    Post count: 3130

    Hi David,

    Do you have a live version of your child theme? If so, it would help if you could provide a link so that we can see the issues in action.


    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #45350

    David Neff
    Participant
    Post count: 48

    I got it fixed thank you

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.