Adjusting Padding Options

Adjusting Padding Options

Adjusting the spacing between menu items in your navigation menus can make your store looks and feel better. Although considered an advanced form of customization this can give your store pages a unique feeling from the rest. To begin editing the spacing in navigation menus you need to open the file "styles.scss" located by navigating through Online Store > Themes > Edit Code. Once there scroll to the bottom where you will paste the following at the very end:

.nav ul.menu li { padding-left: 10px; padding-right: 10px; }

By changing the value of the number in "10px" you are deciding the spacing the between navigation menu items. 

    • Related Articles

    • Pagination Options in the eComm Performance Theme

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance. Our eComm Performance theme has three 'pagination types' to choose from both for your Collection and Search Results pages. These three pages ...

    • Using Custom CSS Within the Shopify Theme Editor

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance. Using the Custom CSS Feature Within the Theme Editor (Customize), the eComm Performance theme allows you to add components and sections ...

    • eComm Performance Guide: Custom Contact Page

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance. Using the Custom Contact Page Template With the release of eComm Performance v6.2.0, not only is there a default contact page template but the ...

    • Cart Settings in the eComm Performance Theme

      Supported Versions: The details shared here in this article apply to the most recent version of eComm Performance.  eComm Performance Cart Type Options The eComm Performance theme includes four different cart type options that you have the option to ...

    • Gallery Section in the eComm Performance Theme

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance.   Using the Gallery Section The eComm Performance theme has a section where you can display only images! The 'Gallery' section is a great way to ...