Refresh theme - Multirow section - Just on mobile - space between image and text

[pete96]

Hi,

using the Refresh theme, Multirow section.  

I am trying to reduce the space between the image and the text associated with the image ( mobile only). On mobile view, the text in the row is set to appear below the image in the row. However, there is a large gap between the picture and the text at the moment.

How do I go about removing or reducing this space?

Thank you

[suyash1]

@pete96 - can you please share this page link?

[pete96]

Hi - Thank you for your reply -

Page link is: somna-sleep.myshopify.com  (Pwd is taglee) 

Scroll down the Home page to where the heading reads "How to Use Your Somna Sleep Original".  This heading and the four columns below it (labelled 1, 2, 3, 4) are part of a 'Multicolumn' section in the Refresh theme.

I am referring to the gap between the heading and the 4 columns. I would like to reduce this gap so the heading and the 4 columns beneath it look more 'connected'.  There is no setting for this in the Theme 'multicolumn' settings.  

Any help would be appreciated!

 

[suyash1 · Accepted solution]

@pete96 - please add this css to the very end of your base.css file and check

@media screen and (max-width: 749px) {
.multicolumn__title {margin-bottom: 1rem !important;}
}

[pete96]

Many thanks for your help - all good now!!

Another part of the page that I find very puzzling is where I am using a 'Rich text' section, such as where you see the heading "Fall Asleep Faster & Deeper -Naturally!".

For this Rich Text section, in the Theme editor I have the "Make section full width" option ticked, and in Theme editor I see a blue box indicating this section is selected, and this blue box is indeed the full width of the screen. But the actual text itself is inside another box, which does not even stretch across the full width of the 'Multirow' section below it, let alone the full width of the screen. And I see no options to make this text box wider.

Would you know how I can make this heading use a width that is the same width as the elements above it and below it are using?

Many thanks again! (I am really surprised these things can't be done in the Theme editor).