WordPress.org

Ready to get started?Download WordPress

Forums

Menu location in header (9 posts)

  1. rmmead
    Member
    Posted 4 years ago #

    I apologize in advance if the simplicity of this question frustrates some, but i have looked all over what i could think to search for in the forums and in google.

    I am currently modifying a theme that has the menu items (home, about, admin, etc) located in the upper right corner of the header. I'd like to move them to the lower left corner of the header. I know how to move it to the left, but have yet to find something to bring it to the bottom of the header.

    I am a CSS novice, so any help would be appreciated.

    Thanks.

  2. martcol
    Member
    Posted 4 years ago #

    If you have a look in the code for this page there's a CSS rule written like this:

    #header ul {
    float:right;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin-right:14px;
    min-width:500px;
    }

    That's the rule float: right that pushes the image over to the right and changing that will stop it happening. However, the <a> element also has a float on it so in this case, the <ul> element will move up to the side of it rather than under it and to the left.

    You need to find the CSS rule I imagine, that applies to the header elements and work out what changes what.

    Have you ever heard of a FireFox plug-in called Firebug? It's terriffic. It enables you to identify what CSS applies to what elements and you can even edit them and watch the live changes. Then, when you're content that you know what to change, you can edit your pages and upload them.

    Be careful though, there are a few things about float that can cause problems and one or two principles that you need to grasp before you embark on too many changes.

    Read up a little on float, positioning and the Box Model - there's loads of stuff out there.

    Martin

  3. rmmead
    Member
    Posted 4 years ago #

    yeah, i'm using firebug to learn all of this, well, using it to see what means what at least, then counting on w3 and a few other sites for definitions. thank you for your advice, i'm about to try to find that bit of code

  4. rmmead
    Member
    Posted 4 years ago #

    okay, i can get the menu items (basically just txt) to be on the left side of the header area, but i'm still not seeing a way to align it to the bottom (yes, i've tried text-align: bottom and it doesn't work)

  5. rmmead
    Member
    Posted 4 years ago #

    for those of you looking to help:

    http://www.remnantfireworship.com/wordpress

    thanks

  6. rmmead
    Member
    Posted 4 years ago #

    1 week later bump...

  7. Mark / t31os
    Moderator
    Posted 4 years ago #

    Update this.

    ul.menu {
    	margin: 0 10px 0 0;
    	padding: 0;
    	text-align: left;
    }

    to.

    ul.menu {
    	margin: 155px 0 0 0;
    	padding: 0;
    	text-align: left;
    	float:left;
    }
  8. rmmead
    Member
    Posted 4 years ago #

    awesome! thank you so much!

  9. Mark / t31os
    Moderator
    Posted 4 years ago #

    You're welcome.. :)

    Feel free to mark resolved to the right of the post -->

Topic Closed

This topic has been closed to new replies.

About this Topic