Search code examples
htmlcsswordpressthemessubmenu

Submenu items not in one line in Wordpress

I am using the Bridge theme on wordpress and it has it's own option to make the submenu wide but when I add more than 4 submenu items it goes into 2 line lets say and I'm trying to solve but no luck yet. Any idead?

the site is http://blog.sondortravel.com/

Solution

  • There are basically two things that are causing your submenu to go into two rows. The first is that the submenu panels have fixed widths of 249px. That's caused by the CSS rule that says:

    .drop_down .wide .second ul li {
    width: 249px;
}

    Your second issue is that your CSS tells every 4th (plus 1) list element to start a new line (clear: both). That's caused by this CSS rule.

    .drop_down .wide .second ul li:nth-child(4n+1) {
    clear: both;
}

    You can fix those by updating your stylesheet so that your width is smaller (and there is room for more li's side by side), and by setting that clear rule to clear: none.