image content grids and spacing...

Highlighted
New Member
8 0 0

Hi All.

I am currently using the content image section and have an image (left or right) and text, but the spacing between the two is ridiculous.
It is using one-half for each of the section blocks but i want to set the image to two-eights and the text to five eighths, is it possible to do this?

if i read the below code correctly, if there are two items both are set to one-half, i need to set image to two-eights and the text to five eighths

{% case section.blocks.size %}
{% when 1 %}
{% assign flex_size = '' %}
{% when 2 %}
{% assign flex_size = 'medium-up--one-half' %}
{% when 3 %}
{% assign flex_size = 'medium-up--one-third' %}
{% else %}
{% assign flex_size = 'medium-up--one-half' %}
{% endcase %}
{% for block in section.blocks %}
<div class="flex__item flex flex--center-vertical {{ flex_size }}" {{ block.shopify_attributes }}>
{% case block.type %}
{% when 'image_block' %}
<div class="flex__item">
{% if block.settings.image != blank %}
<img src="{{ block.settings.image | img_url: '600x' }}" alt="{{ block.settings.image.alt }}" class="image-content__image">
{% else %}
<div class="image-content__image">
{{ 'image' | placeholder_svg_tag: 'placeholder-svg' }}
</div>
{% endif %}
</div>
{% when 'text_block' %}
<div class="flex__item image-content__text text-{{ block.settings.align }}">
<p class="h5">{{ block.settings.title }}</p>
<div class="rte-setting">{{ block.settings.text }}</div>
</div>
{% endcase %}
</div>
{% endfor %}

0 Likes