Lifestyle Pro navigation help

Community Forums Forums Design Tips and Tricks Lifestyle Pro navigation help

This topic is: resolved

Tagged: 

This topic contains 6 replies, has 3 voices, and was last updated by  jtdatawork 7 months, 4 weeks ago.

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

    jtdatawork
    Participant
    Post count: 43

    I have tried for hours to figure this out. The active menu item, and or the hover appear to have a right border of the main background color that extends over into the next menu item area. I just want the menu items to be one color as a link, and another for current or hover, and a white right border. Pretty standard. I have no idea where this extra (border?) is coming from. Can anyone help? Many thanks in advance!

    Judy


    JT Dataworks Web design and SEO

    http://nobones.server303.com/allys-page/
    #89781

    Davinder Singh Kainth
    Participant
    Post count: 1363

    Found an error in your style.css file which could be causing issue. Check following code:

    .genesis-nav-menu > li:hover a,
    .genesis-nav-menu a:hover,
    .genesis-nav-menu .current-menu-item > a {
    	background-color: #621e1e;
    	color: #fff;
    padding: 

    Either remove padding: or make it padding:0px;

    If still issue, update this thread.


    Need website customization services or other Genesis / WordPress help ?
    Davinder @ Design Studio iGuiding Media | My Blog | Fresh Genesis Themes Collection

    #89920

    jtdatawork
    Participant
    Post count: 43

    Thank yous for finding that! It was left over from my attempts to find or fix this, and I removed it.

    But the problem persists. That line is part of the original theme. If you look at the Lifestyle theme demo, you can see it if you click on a link, then mouse over the adjoining one. I just can’t figure out how to remove it. :(

    http://my.studiopress.com/themes/lifestyle/#demo-full


    JT Dataworks Web design and SEO

    #97144

    ryanbednar
    Member
    Post count: 4

    Hi Judy,

    I am having the EXACT same problem, and it’s been driving me crazy… I cannot figure it out! I also have verified that the same problem exists in the Lifestyle Pro demo, so it’s not just the two of us!

    It seems like a right margin or padding is being added to the li.menu-item, but I cannot find any CSS that would be causing this. I can usually figure issues like this out using Firebug, but again there doesn’t seem to be any CSS rules that would be causing this.

    I will open a support ticket and reference this post. I will be sure to post the solution if we find one!

    Thanks,
    ~Ryan

    #97147

    jtdatawork
    Participant
    Post count: 43

    Hi Ryan,

    YAY! I’m not crazy! Thanks for the note. :) After hours of trying to figure it out, it appears that the line is actually part of the background color showing through because the navigation block does not cover it. I tried changing the padding but it didn’t help. I tried finding another theme to use that nav code, but this new “feature” seems to be designed into most of the new themes, not just Lifestyle!

    Fix it I cannot. I finally just changed the design. I’ll be delighted if you can find a solution because this is really cramping my choices in designing the nav bar look on sites.

    Judy


    JT Dataworks Web design and SEO

    #97149

    ryanbednar
    Member
    Post count: 4

    Well, after a few hours and few different approaches, I *think* I’ve figured out the solution!

    As you mentioned, it was definitely the background that was showing through, I just couldn’t figure out where the extra spacing between the buttons was coming from.

    The problem seems to be related to the inline-block value of the “li” element. I’ve added a float:left; to the rule, and it seems to remove the extra spacing between the buttons… still need to do some testing to make sure this doesn’t break anything anything else, but so far so good. Here’s how my new CSS rule looks:

    .genesis-nav-menu .menu-item {
    	display: inline-block;
    	float: left;
    	text-align:left;
    }

    Hope this helps!
    ~Ryan

    • This reply was modified 7 months, 4 weeks ago by  ryanbednar.
    • This reply was modified 7 months, 4 weeks ago by  ryanbednar.
    #97206

    jtdatawork
    Participant
    Post count: 43

    Yep, it worked! Thank you, thank you!

    Judy


    JT Dataworks Web design and SEO

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

The topic ‘Lifestyle Pro navigation help’ is closed to new replies.