Horizontal Menu Help (9 posts)

  1. ThePawSpa
    Posted 10 years ago #

    I am trying to strecth out my horizontal menu to the full width of my header and have a background color but cant get anything to work

    I have read this: http://codex.wordpress.org/Creating_Horizontal_Menus

    And the only menu on that page that will work for me is the middle one:

    navmenu ul {margin: 0; padding: 0;
    list-style-type: none; list-style-image: none; }
    navmenu li {display: inline; padding: 5px 20px 5px 20px}
    navmenu a {text-decoration:none; color: blue; }
    navmenu a:hover {color: purple; }

    I cant get anythin gelse to work or it screws up my menu

  2. ThePawSpa
    Posted 10 years ago #

    Well, I am almost there. I just cant seem to stretch out the light blue background the rest of the way for some reason. And I cant figure out how to increase font size for just that nav area


  3. ThePawSpa
    Posted 10 years ago #


  4. marcy
    Posted 10 years ago #

    Add this to your CSS

    font-size: 1.1em;

    Which will make the text just a bit bigger, just in those menu items.

    I can't tell you how to get the menu to stretch the full width, except to play with the padding and margin numbers for the li items until you find something that works.

    Something else to consider -- the navmenu overlaps the header text just a tiny bit -- at least in FireFox.

  5. ThePawSpa
    Posted 10 years ago #

    yeah, I just noticed that. Havent been able to figure it out. It was fine in IE and I didnt even think about checking FF until late last night. If I add a div tag it just pushes my blog content to the far left and removes the blog bg

    Thanks for tip on font size

  6. ThePawSpa
    Posted 10 years ago #

    Ok, I got to the way I want...in FF. But now it looks like hell in IE. What gives

  7. marcy
    Posted 10 years ago #

    Apparently something is preventing IE from seeing your display: inline and list-style-type: none bits -- sorry to say I'm not exactly sure what is the problem. I hope someone else can help!

  8. ThePawSpa
    Posted 10 years ago #

    I figured it out. In case anyone else is having similar problems...

    The code posted here: http://codex.wordpress.org/Creating_Horizontal_Menus

    just would not work for me and I am using the defualt theme. No matter what I tried it would look good in one browser but not the other. So, I finally used a nav code from Listamatic: http://css.maxdesign.com.au/listamatic/horizontal14.htm
    And it worked on both browsers

  9. gonger
    Posted 10 years ago #

    Okay, after wrestling a couple of nights with this problem, I figured out that the problem was that the browser wasn't loading the new CSS changes...

    Check yours first by viewing your CSS IN THE BROWSER!!

    This means type in your URL field:

    See if your new styles show up in the browser. IF NOT, THEN YOU NEED TO GET A NEWER HTML EDITOR PROGRAM. I was using MSWord to edit my CSS, which didn't allow for the browser to see the new changes. I then downloaded TACO HTML for Mac, and the code was updated, and it worked!

Topic Closed

This topic has been closed to new replies.

About this Topic