How to move navigation menu

Community Forums Forums Design Tips and Tricks How to move navigation menu

This topic is: not resolved

This topic contains 8 replies, has 2 voices, and was last updated by  sassymomblog 1 year, 6 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #15394

    sassymomblog
    Participant
    Post count: 15

    I have the modern blogger theme, I want to move the navigation menu (social media icons) from my header to the sidebar. I tried just moving it in the widget area but it doesn’t look right.   http://www.alittlebitsassy.com/

    #15396

    SoZo
    Moderator
    Post count: 1573

    You need to edit the selectors of the style rules being applied from using #header ul.menu li a to .sidebar ul.menu li


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    #15400

    sassymomblog
    Participant
    Post count: 15

    So to make sure I understand, I change each one that says that correct?

    #15415

    SoZo
    Moderator
    Post count: 1573

    Either that or add new selectors to each grouping.

    And I recommend installing the Firebug add on for Firefox or using Chrome’s Firebug Lite which will enable you to right click on any element to inspect it and determine the associated style rules or the selectors required to create new style rules.


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    #15495

    sassymomblog
    Participant
    Post count: 15

    Ok I changed the code to sidebar, and it definitely looks better, but I would like the buttons to be on the same row and within the sidebar. It looks as if it’s split.  Changing codes freaks me out, I’m scared to screw it all up. lol http://www.alittlebitsassy.com/

    #15498

    sassymomblog
    Participant
    Post count: 15

    Ok I noticed when I moved them to a different order in the widget area in ended up on top of another widget,  not sure what I need to do to fix this.

    #15505

    SoZo
    Moderator
    Post count: 1573

    Floats can mess up height detection. Add “overflow: hidden;” to the .sidebar .wiget rule.

    And to get rid of the dots add “background: none;” to #sidebar ul.nav li, #sidebar ul.menu li


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    #15509

    sassymomblog
    Participant
    Post count: 15

    It worked!   Now I just need them to line up horizontally, but I think I can figure it out, well I’m gonna try to anyway.  I’m determined to figure this all out. lol Thanks for you help!

    #15567

    sassymomblog
    Participant
    Post count: 15

    Ok, I’ve tried everything to get them to line up horizontally, nothing has worked, any ideas?

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

You must be logged in to reply to this topic.