View Full Version : Chrome CSS Drop Down Menu (v2.4) - how to, multiple lines

09-15-2008, 12:07 PM
1) Script Title: Chrome CSS Drop Down Menu (v2.4)

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex1/chrome/index.htm

3) Describe problem: How can I specify a width for the drop down menu items so as if I have long text, this spans over two lines? Unfortunately it's a private project so I can't provide the website's link. In other words, I want that in:

abc | def | ghi | my name is chris | dynamic drive

"my name is chris" and "dynamic drive" are shown in two lines, not one, making sure that the separator(line) uses the whole height.

I hope this makes sense, thank you.

09-16-2008, 06:24 AM
The current chrome menu style (http://www.dynamicdrive.com/style/csslibrary/item/chrome-menu-bar/) of the top menu items doesn't support explicit widths on each of the menu items themselves. Try replacing it with something that does, specifically one that uses "display:block" and "float:left", such as Solid Block Menu (http://www.dynamicdrive.com/style/csslibrary/item/solid_block_menu/). Then within its CSS, you may do something like:

.solidblockmenu li a{
float: left;
color: white;
width: 100px;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;

09-16-2008, 08:11 AM
Thanks mate, will give it a shot!