Search code examples
csswordpressuinavigationbarnavbarhorizontallist

Make a vertical Wordpress navbar submenu horizontal

I want to change my Wordpress navbar so that the dropdown that appears when you hover over a page with subpages positions itself horizontally, not vertically. My "main" navbar is already horizontal, I want the "subnavbar" to be, as well.

A picture says a thousand words:



Current (without hovering)...
| Page 1 | Page 2 | Page 3 | Page 4 |



Current (mouse hovering over Page 2)... 

| Page 1 | Page 2 | Page 3 | Page 4 |
         | Subpage 1 |
         | Subpage 2 |
         | Subpage 3 |
         | Subpage 4 |
         | Subpage 5 |



What I want (mouse hovering over Page 2)...

| Page 1 | Page 2 | Page 3 | Page 4 |
         | Subpage 1 | Subpage 2 | Subpage 3 |
| Subpage 4 | Subpage 5 |

I hope that was clear -- and for the record, I'm using the Fistic theme.

Solution

  • Find the id or class for the subnav - and use float:left to make them line up next to each other instead of below each other.