Pure CSS Mega Menu

[picaflor-azul]

Hi All,

I figured out how to make the "Brands" container into TWO columns instead of one.

First, open the tpl_mega_menu.php file.

Next, find:



and REPLACE it with:



That's it, you now have two columns in your "Brands" container.

Hope this helps someone else as well.
Danny

Thanks for posting your solution ;) If you read further back in the thread I believe that there are also some suggestions for converting the catgegories drop down to a multi column which could be applied to the brands drop down as well.

Thanks,

Anne

[100asa]

How to have menu bar with no gradient background, but trasparent?

[picaflor-azul]

How to have menu bar with no gradient background, but trasparent?

You will edit the includes/templates/override/css/stylesheet_mega_menu.css file.

Thanks,

Anne

[100asa]

You will edit the includes/templates/override/css/stylesheet_mega_menu.css file.

Thanks,

Anne

Thank you so much Anne, but if I asked for help in this forum means I'm not able to do so.

[picaflor-azul]

Thank you so much Anne, but if I asked for help in this forum means I'm not able to do so.

If you post a link to your site I will take a look.

Thanks,

Anne

[100asa]

If you post a link to your site I will take a look.


Thanks,

Anne

Www.100asa.it
Thank you very much

[rbarbour]

How to have menu bar with no gradient background, but trasparent?

You will edit the includes/templates/override/css/stylesheet_mega_menu.css file.

Thanks,

Anne

Find this rule:

#mega-wrapper .mega-menu{width:940px;background:transparent;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;background:#444;background:-moz-linear-gradient(top,#ccc,#383838);background:-webkit-gradient(linear,0% 0%,0% 100%,from(#ccc),to(#383838));border:1px solid #444;-moz-box-shadow:inset 0px 0px 1px #edf9ff;-webkit-box-shadow:inset 0px 0px 1px #edf9ff;box-shadow:inset 0px 0px 1px #edf9ff;list-style:none;margin:30px auto 0px auto;height:40px;padding:0px 20px 0px 20px;}

change to this:

#mega-wrapper .mega-menu{width:940px;background:transparent;/* -moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;background:#444;background:-moz-linear-gradient(top,#ccc,#383838);background:-webkit-gradient(linear,0% 0%,0% 100%,from(#ccc),to(#383838));border:1px solid #444;-moz-box-shadow:inset 0px 0px 1px #edf9ff;-webkit-box-shadow:inset 0px 0px 1px #edf9ff;box-shadow:inset 0px 0px 1px #edf9ff;*/list-style:none;margin:30px auto 0px auto;height:40px;padding:0px 20px 0px 20px;}

or this: (but not both)

#mega-wrapper .mega-menu{width:940px;background:transparent;list-style:none;margin:30px auto 0px auto;height:40px;padding:0px 20px 0px 20px;}

Ray

[100asa]

Than you rbarbour, works great!

[100asa]

I've 4 email address for recipient contact_us page; the email send from contact_us box on mega menu don't send and so don't arrive.

[picaflor-azul]

I've 4 email address for recipient contact_us page; the email send from contact_us box on mega menu don't send and so don't arrive.

The form is currently set up for 1 email address only. You will need to make adjustments if you want to use it with the email drop down like on the standard contact us form.

Thanks,

Anne