user3613444
user3613444

Reputation: 9

how do I make my dropdown menu wider?

I am using the archi wordpress theme which is a great theme. I am looking how to make the dropdown menu width wider so my text is on 1 line rather then 2 lines.

My website: http://cobbys.gentwijzer.be/fabrieksverkoop/

For example menu item: Stoffen, dropdown is ok except for "brandvertragende stoffen" . How do I increase the width of the dropdown so it will be on 1 line.

Thank you

Upvotes: 0

Views: 2909

Answers (2)

hungerstar
hungerstar

Reputation: 21675

I would change from:

#mainmenu li ul {
    width: 200px;
}
#mainmenu li li a {
    width: 200px;
}

to

#mainmenu li ul {
    width: auto;
}
#mainmenu li li a {
    width: auto;
    white-space: nowrap;
}

Using width: auto will allow the ul of the dropdown to grow as needed and you won't be stuck specifying a universal width for all dropdowns or manually setting a specific width for each dropdown.

white-space: nowrap; prevents the text from wrapping to a new line when there is not sufficient space to do so.

Upvotes: 3

Marian Ioan
Marian Ioan

Reputation: 317

Set the width of #mainmenu li ul to what ever you want(for example 300px) and on #mainmenu li li a use width:auto

Upvotes: 0

Related Questions