Fine tuning the secondary navigation in Genesis Prose Theme

[BeltofTruthSteve]

I'm using the Prose theme with the Genesis framework and I'm trying to fine tune the navigation bar. You can view my site here.

I have zero knowledge of CSS other than cutting and pasting code snippets into the custom code boxes in the admin panel. That being said, can anyone help me figure out how to make the following tweaks to the secondary navigation bar?

1. Center the buttons
2. Space them apart a bit more
3. Add a 1-pixel, dotted vertical divider (to match the line beneath the sidebar headings) between each button (this is optional)
4. Make the first button (START HERE) bold.

Thanks!

http://69.89.31.85/~beltoftr/

[Sridhar Katakam]

Looks like you managed all except # 3?

Use this CSS:

#subnav li {
    background: url('http://i.imgur.com/DjkLDai.gif') no-repeat right;
    padding-right: 1px;
}

#subnav li li {
    background: none;
    padding-right: 0;
}

#subnav li ul {
    width: 200px;
}

#subnav li li a, #subnav li li a:link, #subnav li li a:visited {
    width: 180px;
}

---

Genesis Tutorials | Follow me on Twitter

[BeltofTruthSteve]

I pasted your code into the Custom CSS box and it didn't seem to change anything. Any ideas why not?

Either way, thanks for your help.

[BeltofTruthSteve]

Okay, so I had a friend help me figure this out. The following snippets add a vertical divider between buttons, center the buttons, and space them out evenly.

#subnav .wrap {
display: table;
margin: 0 auto;
width: auto;
}

#subnav li {
border-left:1px dotted #31150c;
}
#subnav li:first-child {
border-left:none;
}

#subnav li a {
padding:7px 29px 6px;
}

[Liz]

Would one of you please post the code needed to center the navigation bar? I've found 2 posts where people asked the question and then figured it out on their own. However, I see no answer and still need to know that part.

[Sridhar Katakam]

Liz, which theme are you using? Can you provide the URL of your site?

---

Genesis Tutorials | Follow me on Twitter

[Author]

Posts