Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

Size of submenu items with Zen Grid

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Bonjour,

I can't manage to reduce the size of the box for submenu items (main menu in top position with Zen Blank).

I think it is not a css question, but a html one, because I saw this, using firebug :

style="float: none; width: 27em; display: none; visibility: hidden;"

but I don't find where is the file in which I can modify the code.

Thank you for your help,

Guy
  • Guy Chiaramella's Avatar
  • Guy Chiaramella
  • 12 Month basic
  • 68 posts
  • Karma: 1
The administrator has disabled public write access.
Guy,

When using the Zen Blank layout, you'll want to make this adjustment in the template_css.css file within the css folder. Open up this file and go to this group heading;

/* @group First Drop Down */

The default drop-down menu sizes can be adjusted here. There are 5 separate lines of code you'll have to adjust and they are as follows;

#nav li ul {position: absolute; width: 244px; z-index: 30;top: -9999px}

#nav li ul li#current {width: 240px}

#nav ul li li a {padding: 6px 8px;width: 228px;margin: 0;display: block;cursor: pointer;}

#nav ul li li span.expanded, #nav ul li li span.sublevel {padding: 6px 8px;margin: 0;width: 228px;display: block;cursor: pointer;}

#nav ul li li.sfHover ul {left:244px;top:0px}

Change the 244px, 240px, 228px, 228px & 244px settings to the 'equal' values you want. If you want to reduce the overall drop-down menu widths by 30px, then your settings would be, 214px, 210px, 198px, 198px & 214px.

Ed
  • Ed's Avatar
  • Ed
  • LIfetime Developer - Big Bamboo
  • 1693 posts
  • 45 Thanks
  • Karma: 60
The administrator has disabled public write access.
Hello Ed,

I'm sorry, maybe something I'm doing wrong but the problem still remain.

In my template_css.css file, I have made these adjustments (reducing the widths to 100px just to see what happen) :

/* @group First Drop Down */

.moduletable-superfish li ul,#nav li ul {position: absolute; width: 144px; z-index: 30;top: -9999px}

.moduletable-superfish li ul li#current,#nav li ul li#current {width:140px;}

.moduletable-superfish ul li li span.expanded,#nav ul li li span.expanded, #nav ul li li span.sublevel,.moduletable-superfish ul li span.sublevel {padding: 6px 8px;margin: 0; width:128px; display: block;cursor: pointer;}

.moduletable-superfish ul li li.sfHover ul,#nav ul li li.sfHover ul {left:144px;top:0px}

But nothing I can observe happen and the size of submenus is still the same.

I noticed that my original code was not exactly the same of yours (just one indication of width / four), as you can see :

/* @group First Drop Down */

.moduletable-superfish li ul,#nav li ul {position: absolute; z-index: 30;top: -9999px}

.moduletable-superfish li ul li#current,#nav li ul li#current {}

.moduletable-superfish ul li li span.expanded,#nav ul li li span.expanded, #nav ul li li span.sublevel,.moduletable-superfish ul li span.sublevel {padding: 6px 8px;margin: 0;display: block;cursor: pointer;}

.moduletable-superfish ul li li.sfHover ul,#nav ul li li.sfHover ul {left:244px;top:0px}

My version of the zen grid framework is 1.0.5.3

Merci pour votre aide.

Guy
  • Guy Chiaramella's Avatar
  • Guy Chiaramella
  • 12 Month basic
  • 68 posts
  • Karma: 1
The administrator has disabled public write access.
Hi Guy,

I think there was a misunderstanding here. With the original Zen Grid template you would have to manually adjust drop-down width as Ed showed, but you are using the Zen Grid Framework (which is quite different)!

You can adjust the width of the dropdowns in the template settings, with min and max widths. ;)
  • Seth's Avatar
  • Seth
  • Moderator
  • 8358 posts
  • 225 Thanks
  • Karma: 202
The administrator has disabled public write access.
Hello Seth,

Yes there was (a misunderstanding) and now it works (reducing the width of the submenus by adjusting it in the template panel).

I'd rather think first, before wanting to modify the files, to use all the flexibility offered by the templates based upon Zen Grid Framework.

Thanks and regards,

Guy
  • Guy Chiaramella's Avatar
  • Guy Chiaramella
  • 12 Month basic
  • 68 posts
  • Karma: 1
The administrator has disabled public write access.
Seth,

Thanks for filling in the blanks for Guy. When he originally referenced the Zen Blank, I just assumed you got to him earlier knowing your love for this layout! Next time I'll remember to ask what base JB template is in play...

Guy, sorry for sending you down the path of code adjustments when your needs would have been better served via the base template settings....

Have a great weekend gentleman!

Ed
  • Ed's Avatar
  • Ed
  • LIfetime Developer - Big Bamboo
  • 1693 posts
  • 45 Thanks
  • Karma: 60
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers