How to make image-with-text image smaller

In the custom css of the section, add in:

.image-with-text .image-with-text__media-item.image-with-text__media-item--small img {

    height: 70%;

    width: 70%;

    margin: 15%;

}

• Related Articles

• Create a Video with Text Section

  Create a new section with this code, called "video-with-text.liquid" {{ 'component-video-with-text.css' | asset_url | stylesheet_tag }} <div class="video-with-text {% if section.settings.full_width %}video-with-text--full-width{% else %}page-width{% ...

• Make a image banner section overlay with another at the top

  In the image banner section, paste the following in custom css: @media screen and (min-width: 750px){ .banner { position: relative; z-index: -20; margin-top: -180px; padding-bottom: 50px; }}

• Make collection list carousel image smaller

  In collection-list.liquid, add the followings: { "type": "select", "id": "mobile_columns", "label": "t:settings.mobile_columns", "options": [ { "value": "1", "label": "t:options.one_number" }, { "value": "2", "label": "t:options.two_number" }, { ...

• Full width text for image banner on desktop

  In custom css, add the following: @media only screen and (min-width: 750px) { .banner--content-align-left.banner--desktop-transparent .banner__box { max-width: 100% !important; } }

• Make parent link clickable

  Snippets > header-mega-menu.liquid (l.19-25) Parentlink {%- assign parentlink = link.links[0] -%} <a href="{{ parentlink.url }}" title="{{ parentlink.title }}"> <span {%- if link.child_active %} class="header__active-menu-item" {% endif %} > {{- ...