Fix image width with higher specificity selector (Shopify#1257)

* fix image width with higher specificity selector * simplify selector
joeybab3 · Jan 24, 2022 · cd2c3f8 · cd2c3f8
1 parent 64af5ca
commit cd2c3f8
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/assets/section-multicolumn.css b/assets/section-multicolumn.css
@@ -85,7 +85,7 @@
 }
 
 .multicolumn-list__item.center .media--adapt,
-.multicolumn-list__item .media--adapt img {
+.multicolumn-list__item .media--adapt .multicolumn-card__image {
   width: auto;
 }
 

diff --git a/sections/multicolumn.liquid b/sections/multicolumn.liquid
@@ -54,6 +54,7 @@
                       style="padding-bottom: {{ 1 | divided_by: highest_ratio | times: 100 }}%;"
                     {% endif %}>
                     <img
+                      class="multicolumn-card__image"
                       srcset="{%- if block.settings.image.width >= 275 -%}{{ block.settings.image | img_url: '275x' }} 275w,{%- endif -%}
                         {%- if block.settings.image.width >= 550 -%}{{ block.settings.image | img_url: '550x' }} 550w,{%- endif -%}
                         {%- if block.settings.image.width >= 710 -%}{{ block.settings.image | img_url: '710x' }} 710w,{%- endif -%}