Top Menu Custom Edit

[getshopped]

Hello,
 
Im hoping someone can help me get my top menu to look like the attached image.

 

Thanks in advance!

Adam

[rocky]

Try adding the following to themes/default-bootstrap/css/blocktopmenu/css/superfish-modified.css:

.sf-menu > li { display: table; width: 120px; text-align: center; margin-bottom: 0 }
.sf-menu > li li { text-align: left; }
.sf-menu > li > a { display: table-cell; vertical-align: middle; height: 55px; font-size: 14px; line-height: 20px; padding: 6px 12px }
.sf-menu, .sf-menu > li, .sf-menu > li > a { border: none; }
.sf-menu > li:nth-child(8) > a, .sf-menu > li:nth-child(9) > a, .sf-menu > li:nth-child(10) > a, .sf-menu > li:nth-child(11) > a { background: #054e92; color: #fff; }

This code displays the menu items as a table so that the content can be vertically aligned, gives each item a fixed width so it can have two lines, centres the text horizontally and vertically, removes all borders and changes the eighth, ninth, tenth and eleventh items to have a blue background with white text.

 

Hopefully, this will give you a good starting point to achieve what you want.

[getshopped]

Awesome cheers rocky.

 

It's getting there now, just need to sort the spacing out a little >> http://midlandautofactors.co.uk/