Footer Menu Help

[mowen10]

Hi, i am looking for some help in regards to adding a few footer menus in my template. Unfortunately I am working on my localhost so dont have anything live to show you but hoping someone can help, as you always do

I have created a new menu and also added a new module to define the menu and its position. I have selected to show the title but the problem I am having is displaying this in the way i would like. (2 images attached, sample.jpg is how i would like the final outcome to look like, sample2.jpg is what I am getting)

As you will notice sample2.jpg has a big gap on top of the title (electronics menu) and when I have checked this with firebug, I can see a moduletable class. I have tried to switch the style tag to none but this then gets rid of the menu title. How can i get this fixed?

If somebody could please advise.

Thanks in advance.

[iextensions]

you must check css and js, then apply on new module. That is coding.

[mowen10]

Hi, thanks for your reply. I have checked the css but there is no styling for moduletable within my css file.

[sander_v_bergen]

You can add a custom 'Module Class Suffix' to you module.
In your css you can add some styling to this class.

[Per Yngve Berg]

Do you know how to use Firebug?

http://docs.joomla.org/Diagnostic_tools

[mowen10]

Thanks for your replies, i am aware I can add module class and also know how to use firebug. I have added module class called test and added a height of 10px to reduce the gap but this still leaves the gap at the top. The h3 tag for the module title doesn't have a height, but when I add one this brings everything onto 1 line with the menu links.

[Per Yngve Berg]

Have you tried to set the line-height?

http://www.w3schools.com/cssref/pr_dim_line-height.asp

[sander_v_bergen]

heading (h1,h2,..) tags have a default margin. Try to set the margin and see what is does.

[mowen10]

Hi, thanks for your replies. I have added the line-height and margin and this makes a slight difference but still have a gap at the top. I have added some 2 images of my page with the stylesheet view from firebug. Apologies as site is on my localhost, but thot a visual might help.

Thanks once again.

[Per Yngve Berg]

There is still a 12px margin at top and bottom.

[mowen10]

per yngve berg, i have added a margin:0 to the h3 tag and that gets rid of the12px margin, but the issue is within the grey box itself (sample1.jpg) where there is a gap above the design (title) and I would like there to be no gap at all.

[Per Yngve Berg]

Check padding on parent element.

[mowen10]

thanks per yngve berg, tried the padding but no resolve

Still going through firebug to try and fix it..