Center posts and color navigation bar background

Community Forums Forums Design Tips and Tricks Center posts and color navigation bar background

This topic is: resolved

This topic contains 8 replies, has 2 voices, and was last updated by  asterbird 10 months, 3 weeks ago.

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

    sjogborn
    Member
    Post count: 10

    Hi all,

    I just started using the Foodie theme and have a couple of questions – tried searching for the answer in the forums, but I’m not sure whether I’ve gone too far and messed up the CSS…

    My site is at http://www.clarkandschiller.com

    1.) I’d like to center my posts and the title of the posts
    2.) I’d like to give a background color to my navigation bar and edit the current text color of the navigation bar

    Any help you can provide would be greatly appreciated.

    http://www.clarkandschiller.com
    #87271

    sjogborn
    Member
    Post count: 10

    Just bumping this…can anyone help?

    #87306

    asterbird
    Participant
    Post count: 101

    Hi @sjogborn, are you comfortable going into your style.css file and making changes?

    1) If you want to center everything, including title, photo, and meta, here’s a good place to start – add text-align: center; to the entry class in line 1596 in your stylesheet. You’d end up with this:

    .entry {
        background: #fff;
        margin-bottom: 2rem;
        padding: 0 0 2.2rem;
        text-align: center;
    }

    2a) Background color is line 1418 in your style.css. Try:

    .genesis-nav-menu {
        color: red;
    }

    2b) Text color of navigation is line 1442 in your style.css. Try:

    .genesis-nav-menu a {
        color: blue;
    }

    Hope that helps! Cheers,

    • This reply was modified 10 months, 3 weeks ago by  asterbird.
    • This reply was modified 10 months, 3 weeks ago by  asterbird.
    #87354

    sjogborn
    Member
    Post count: 10

    Hi @asterbird, definitely comfortable editing the .css file, and the centering worked!

    However, when I go back to change the color of the navigation menu or the text, it still doesn’t change. Any idea why; is there code somewhere that’s preventing that change from happening?

    Thanks for your help!

    #87356

    asterbird
    Participant
    Post count: 101

    Yes, it’s line 1454 now. With your other changes, the line #s change :)

    See the following on line 1454?

    .genesis-nav-menu a {
    	border: none;
    	color: #333;
    	font-size: 12px;
    	font-size: 1.2rem;
    	display: block;
    	padding: 16px 22px;
    	padding: 1.6rem 2.2rem;
    	position: relative;
    }

    Change the #333 color to red, that should work. Then on line 1442, delete .genesis-nav-menu a { color: red; } since you don’t need that after all.

    #87363

    sjogborn
    Member
    Post count: 10

    @asterbird, got it. Thanks for your help. One last question – the color isn’t consistent across the entire bar – any idea where I can go to fix that? Does this have to do with display: block?

    Thanks again!

    #87369

    asterbird
    Participant
    Post count: 101

    Looks like you have the green background on each li. You can try adding the green to the ul instead of li.

    Go to line 1425: .genesis-nav-menu {... and add background: green; to it.
    Then delete the green background on the li that you have.

    Hope that helps :)

    #87375

    sjogborn
    Member
    Post count: 10

    You’re the bomb, @asterbird. Thank you!

    #87377

    asterbird
    Participant
    Post count: 101

    np :)

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

You must be logged in to reply to this topic.