How to reduce the distance between headline and tags using a responsive list

You could try for example:

.responsive-tag-groups-list h3 {
  margin-bottom: 5px !important;
}

If you use @media in your CSS you can use different values for each screen size.

When I put

.responsive-tag-groups-list h3 {
  margin-bottom: 5px !important;
}

into the custom css, the words “.responsive-tag-groups-list h3” get red color.

Is there a special area, where I have to put the code in?

My custom css looks like this:

@media only screen and (max-width: 700px) {
  .responsive-tag-groups-list {
    column-count: 1;
    /** text-align: center; **/ /** optionally uncomment the code on the left to align tags to the center **/
  }
}
@media only screen and (min-width: 701px) and (max-width: 1000px) {
  .responsive-tag-groups-list {
    column-count: 2;
    column-gap: 10px;
  }
}
@media only screen and (min-width: 1001px) {
  .responsive-tag-groups-list {
    column-count: 3;
    column-gap: 10px;

Where did you put it? Maybe some CSS that you have before is not finished (like missing }).

This should work:

@media only screen and (max-width: 700px) {
  .responsive-tag-groups-list {
    column-count: 1;
  }
  .responsive-tag-groups-list h3 {
    margin-bottom: 5px !important;
  }
}

and so on

My custom css looks like this:

Two closing curly braces are missing in your CSS at the end.

Thank you very much, like you have said it, it works in both ways (I can use it just for the small screens or for all screen sizes).

I would like to do the same with the gap under the taglines. Is there a possibility to reduce the distance between the last tagline (e.g. of the letter S) and the next headline (in this example “T”), too?

This would be margin-top. All together:

  
.responsive-tag-groups-list h3 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

That’s it! Thank you very much, again!

You’re welcome ??