Packing taxonomy fields into one div not from SQL? I created 2 taxonomy entity-reference fields. One is Categories and one is Tags and some similar other fields.

In nodes, some of these taxonomy fields appear one above the other.

I want to give some padding-top and padding-bottom css code, not to each one - but to all together.

Yet, they don't sit inside a wrapping div and wrapping them through the SQL isn't quite comfortable, though I am not sure it's a minimalist/easy to supervise/safe solution.

Do you know a way to bias Drupal 8 to "pack" some of these into a div ? Maybe an intervention in the Twig could do that with some behavior-code?
This is the content of field.html.twig in the core theme classy:

{%
  set classes = [
    'field',
    'field--name-' ~ field_name|clean_class,
    'field--type-' ~ field_type|clean_class,
    'field--label-' ~ label_display,
  ]
%}

{%
  set title_classes = [
    'field__label',
    label_display == 'visually_hidden' ? 'visually-hidden',
  ]
%}

{% if label_hidden %}
  {% if multiple %}
    &lt;div{{ attributes.addClass(classes, 'field__items') }}&gt;
      {% for item in items %}
        &lt;div{{ item.attributes.addClass('field__item') }}&gt;{{ item.content }}&lt;/div&gt;
      {% endfor %}
    &lt;/div&gt;
  {% else %}


Each field is packed into a div with its own class field--name-field-name. In your case field--name-field-tags and field--name-field-categories.

Steps for solution:


If you don't use classy as base theme you can put somehting similar in your custom theme or simply copy this twig from the classy theme and change as needed.

core/themes/classy/templates/field/field.html.twig -> themes/mytheme/templates/
Flush all cache.