How to extend Society Theme menu tab height

When you add a larger logo, you may see a gap at the top of the header image in the Landing Page Layout and the DD Header Layout. This tutorial cover how to extend the menu tab height so you can eliminate the tab.


Click here Click here to open your Weebly Editor and to open up the W Theme Editor.

Once you are in your Weebly account, open the W Theme editor by clicking on “Design” and into “Edit html/css”. Please see the screenshot below for detail reference.

Step1: Open main_style.css

a) We will first open the main_style.css page located in the top left hand column of the W Theme Editor

b) Once open locate the code below

#navigation a {
  • display: inline-block;
  • text-decoration: none;
  • padding: 22px 15px;

The default height is 22px. You can change this number to fit your new logo height. You can use the “preview” feature to adjust the tab to the perfect height.

Step2: Save & Exit

Once you have the height the way you want, just save & exit the W Theme Editor