Text with image section reorder & centre text - desktop and mobile

Store Design
1

Hi there,

I’d like my first ‘Image with Text’ section to show with all the text centred and above the image (rather than next to each other).

So in this order on both desktop and mobile:

HEADLINE ‘Great Days Out!’
TEXT

IMAGE

SHOP NOW BUTTON

How do I change this please?

www.quiztrail.co.uk

Thank you in advance.

2

Hi @quiztrail ,

#shopify-section-1643742324d2861aba .feature-row {
    display: flex;
    flex-direction: column-reverse;
    align-items: unset;
    text-align: center;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

1 Like
3

@quiztrail ,

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >theme.css and paste this at the bottom of the file:
#shopify-section-1643742324d2861aba .feature-row {
    display: flex;
    flex-direction: column-reverse;
    text-align:center;
    align-items: unset;
}

Thanks!

4

Hi,

Thank you for your help.

  • Is it possible to do this on Desktop too please?

  • And can I have the ‘Shop Now’ button underneath the image?

5

@quiztrail ,

If my solution is helpful to you, then please accept it.

1 Like
6

@oscprofessional Thank you. Are you able to help with the below too please?

  • Is it possible to do this on Desktop too please?

  • And can I have the ‘Shop Now’ button underneath the image?

7

@quiztrail

Have you added the code ??

oscprofessional_0-1643799493177.png
oscprofessional_0-1643799493177.png1340×1055 289 KB

it is for mobile also.

1 Like
8

Hi @oscprofessional ,

I have added the code and it worked on Mobile but not Desktop unfortunately. Is it possible to have the same layout on Desktop please?

Also can I have the ‘Shop Now’ button underneath the image?

Thank you.