WordPress.org

Ready to get started?Download WordPress

Forums

Custom Community
menu / nav bar positioning (14 posts)

  1. atssales
    Member
    Posted 8 months ago #

    hey yall. so I'm using Custom Community and need some css [or direction which php file this is in and i could modify it there]

    I want to reposition the main nav bar [top menu]to float the same width as the container, where the bar is justified right but the tabs in it are justified left

    help?

    Thank you :)

  2. Ham Radio
    Member
    Posted 8 months ago #

    Use this, and change it so that your nav bar is center:

    #access .menu-header, div.menu {
        font-size: 13px;
        margin-left: 25px;
    }
  3. atssales
    Member
    Posted 8 months ago #

    oh awesome! that moves the text within the navbar appropriately . i put
    'margin-left: 10% '
    but how do i change the navbar background to being limited to a certain px padding instead of full-width? cause i have a bluebar across the entire page now and the tabs boxing within that

  4. Ham Radio
    Member
    Posted 8 months ago #

    #access {
        background: none repeat scroll 0% 0% rgb(237, 237, 237);
        display: block;
        float: left;
        padding-top: 6px;
        width: 100%;
        position: absolute;
        bottom: 0px;
        margin: 0px 0px -40px;
    }

    Change "width" to the width you want, then change the middle value of "margin" to move it across the screen.

  5. atssales
    Member
    Posted 8 months ago #

    Ham, you're the best :D

  6. atssales
    Member
    Posted 8 months ago #

    ya know... if i could steel some more of your intel here, do you know how to change the container width to a % ?

    i posted the question earlier here:
    http://wordpress.org/support/topic/how-to-fix-container-and-menu-location?replies=1

  7. Ham Radio
    Member
    Posted 8 months ago #

    Your Welcome :)

    Please give me the link to your website.

  8. Ham Radio
    Member
    Posted 8 months ago #

    Have you made sure the theme setting "responsive" is enabled?

    Appearance -> Theme Settings -> General Tab -> Responsive (Third from the top). Make sure it is set on "Enabled"

  9. atssales
    Member
    Posted 8 months ago #

    the website is ats-sales.com

    although its under maintenance mode so i dont think that will be helpful...

    it is enabled already :/

    Is it possible to make the container a minimum of X number of pixels and beyond that to make it a certain percentage of the screen? it also reduces size faster when i zoom out than the navbar does

  10. Ham Radio
    Member
    Posted 8 months ago #

    div#sidebar {
        width: 15%;
        margin-left: -225px;
    }
    .paddersidebar {
        padding: 30px 10px;
    }

    These should be the setting that you are looking for.

  11. atssales
    Member
    Posted 8 months ago #

    this is probably a dumb question, but how do i change the actual container's dimensions? this moves around the contents within the side bar but not the fixed width of the container itself? i simply tried under div#sidebar to put 'container: 350px;' but it didn't work.

    Also, because I have so many more questions in life than answers, how would i address the main container's width?

  12. Ham Radio
    Member
    Posted 8 months ago #

    To change the width of the containers themselves, you need to change the responsive setting from "enabled" to disabled". That will give you options to change the container widths.

    As for puting 'container: 350px;' under "div#sidebar", you can't do that or anything like that. CSS has rules, and the browser interepts those rules. You can only use rules that are specifically used for CSS.

    You can try this to change the main container:

    #container .row-fluid .span8, .row-fluid .span8 {
        width: 975px;
    }

    And this for the sidebar:

    div#sidebar {
        width: 225px;
        margin-left: -225px;
    }

    Otherwise, you are going to have to turn responsive off, and chage the width from there.

  13. atssales
    Member
    Posted 8 months ago #

    ohhhhh!!

    so many resolved issues

    Ham-- you're amazing

    for future confused people: turn your responsiveness to 'disabled' or it will fight with your css changes, make SURE you change settings from px to % [if you want it proportionate] and then use the code ham wrote and its perfect.

    it looks great, thank you!

  14. Ham Radio
    Member
    Posted 8 months ago #

    Your Welcome, and thank you.....Happy to Help :)

Reply

You must log in to post.

About this Theme

About this Topic