Change the space between categories

[Kurre]

osCommerce 2.3.4.1. CE Bootstrap

How do I change the space between the categories in the categorie menu ? It is to big now..

 

 

[♥JcMagpie]

change the css to reduce the padding or margin.

 

[Kurre]

Tnaks @JcMagpie but it did not change the padding between category names only the margin to the box.

[♥JcMagpie]

post your code or link to site it's quite straightforward, are you using BS3 or BS4?

[♥JcMagpie]

Done on BS4 but principal is same for BS3 give the class an id and make css changes in user.css

[MrPhil]

Be careful if you're reducing margins or padding when displaying on a touch-screen device like a phone. There's deliberately extra space there so that people with fat fingers won't accidentally tap the wrong entry. Reduce it too much, and you'll get lots of complaints that your site is unusable.

 

[René H4]

Add this code to your user.css and play with the figures:

 

#columnLeft .nav>li>a {
    position: relative;
    display: block;
    padding: 2px 15px;
}

I did not make it up, but I had the same problem when I still used the left nav panel. Someone added this for me... 🙂
 

[peterbuzzin]

By all means do the below:

14 minutes ago, René H4 said:

Add this code to your user.css and play with the figures:

#columnLeft .nav>li>a {
    position: relative;
    display: block;
    padding: 2px 15px;
}

I did not make it up, but I had the same problem when I still used the left nav panel. Someone added this for me... 🙂
 

But it comes with the caveat that it will affect all nav li a  in the left column and as MrPhil linked to I would only do it for desktop devices or you may suffer an accessibility penalty from search engines.

To target only desktop/large screen devices use below which is the above code but amended with a media query.

@media (min-width: 992px) {
  #columnLeft .nav>li>a {
      position: relative;
      display: block;
      padding: 2px 15px;
  }
}

 

[Kurre]

Thank you @peterbuzzin that worked out so good!

 

[SCH_001]

@Kurre

So it does not affect every where you are best to create your own like here line 40 in /includes/modules/boxes/bm_categories.php  "mycatagory"

$OSCOM_CategoryTree->setParentGroupString('<ul class="nav nav-pills nav-stacked" id="mycatagory">', '</ul>', true);

The change #columnLeft to #mycatagory in user.css

[Kurre]

@supercheaphobb thanks, that is a better way!

The shop I changed had only 2 menu boxes so I did not think of it.