Dividing the Top Menu subcategory into two columns.

Hello, I was looking around the forum but unfortunately I couldn't find an solution to this problem.



I have one main category in the top menu called Apple, below this if you hover on the top menu you will see iPhone 2G til 4S iPod Touch 2G Till 4G etc. Those 12 categories are shown as one big list. Also these categories do have a third level category but I was already able to disable this in the block manager. (Refer to Untitled.png)



What I want to do is dividing all those category's into two or X columns refer to 'Untitled2.png'.



I already tried a lot but couldn't get it to work. I think this is also an small bug or an forgotten coding because, it's strange that when you open the category 'Apple' the category's are dived into two columns. Refer to Untitled3.png



Thanks for reading and I hope someone comes with an solution to this problem. I will also post this in the bug tracker, because when opening 'Apple category' it's perfectly divided into two columns. In contrast with the top menu.



Regards,



Michiel



Sorry I see I placed this topic in the wrong category it must be template and design ofcourse

Untitled.png

Untitled2.png

untitled3.png

Anyone figure this out? I would like to do the same.

I have talked with a custom developer and the modification can be done for 180 USD, I want to pay max 60 USD for this modification so maybe we can share the cost with some more people? What wold you like to pay for this mod?

[quote name='telefoongarage' timestamp='1351148073' post='147640']

I talked with a custom developer and the modification could be done for 180 USD, I want to pay max 60 USD for this modification so maybe we can share the cost with some more people? What wold you like to pay for this mod?

[/quote]

Hi there!



I think, I can make this modification for you. If you are interested, please send me a private message.



Regards,



Istvan

This video represents a working demo on my localhost: [media]- YouTube

If anyone's intrested in this modification, send me a private message.

All you need to do is adjust the 1 column width to accommodate two columns



In dropdown.css look for





/* Drop downs sizes */

.dropdown-1column {width: 318px;} <----- Adjust

.dropdown-2columns {width: 318px;}

.dropdown-3columns {width: 473px;}

.dropdown-4columns {width: 628px;}

.dropdown-5columns {width: 783px;}





and





.dropdown-multicolumns .col-1 {width: 300px;} <----- Adjust

.dropdown-multicolumns .col-2 {width: 300px;}

.dropdown-multicolumns .col-3 {width: 455px;}

.dropdown-multicolumns .col-4 {width: 610px;}

.dropdown-multicolumns .col-5 {width: 765px;}

.dropdown-multicolumns .col-6 {width: 920px;}





Adjust as needed to fit your design

Hi Triplets thanks for your message, well this is a perfect solution if you only got secondary level categories. However if you have also third level categories like me this will be a mess, as you can see on screenshot below. Secondary categories are placed under each other and aren't line out correctly.



However I think you can change this if you modify the values below by double.





.dropdown-multicolumns .col-1 {width: 145px;} 300

.dropdown-multicolumns .col-2 {width: 300px;} 600

.dropdown-multicolumns .col-3 {width: 455px;} 910

.dropdown-multicolumns .col-4 {width: 610px;}1220 (problem)

.dropdown-multicolumns .col-5 {width: 765px;} problem

.dropdown-multicolumns .col-6 {width: 920px;} problem



Columns are now to width, There must be another fix to make an exception for third level categories?

Schermafbeelding 2012-10-31 om 20.55.03.png