Secondary Menu Drop Down Horizontal Instead of Vertical

[jono.cusack]

Hi,

How do I make the drop down menu entitled 'Destinations' in my Secondary Menu appear horizontal instead of vertical.

Cheers

Jono

http://www.seesomething.com.au

[WisdmLabs]

Hey,
I did check out site.
try adding following in your child-theme's style.css

/* For horizontal secondary menu drop down */
.genesis-nav-menu.menu-secondary .sub-menu{
      width: auto;
}
.menu-secondary .sub-menu .menu-item{
      float: left;
}

This will override the property where the width of the drop-down is restricted and sets the drop-down items to align next to each other.

---

http://wisdmlabs.com/

[jono.cusack]

Yep that works thanks, but now Ive realised that the selections are too big. How do I change the size of the them? Also how to do I change the font, font size and the colour of the background of the selection buttons?

I've left it as is so you can check it out.

Thanks!

Jono

[jono.cusack]

I was wondering if you had found a solution here yet?

Cheers!

Jono

[WisdmLabs]

Hey Jono,
For changing the width of the dropdown-menu you will have to change the following properties.

.genesis-nav-menu .sub-menu a{
   width:           ; /* You can enter the width in pixels or keep it auto. Ex: 125px or auto */
   font-size:      ; /* Enter the font-size in pixels or percentage  */
   background-color:     ; /* Enter color in hex codes or in rgb values , refer
 https://developer.mozilla.org/en-US/docs/Web/CSS/background-color  */
}

For fonts I would suggest choosing a font from google fonts (http://www.google.com/fonts)
This article explains very nicely how to add google fonts on genesis powered site. http://www.studiopress.com/tips/google-web-fonts.htm

---

http://wisdmlabs.com/

[jono.cusack]

Thanks so much mate!

[Author]

Posts