Position heading in the image banner to the right upper corner

[JordanGabe]

Hey! I’d like to position the heading text and button in the image banner to the right upper corner. Both on desktop and especially on mobile view.

my website url is https://charmflowerstudio.com/

[kazi_1]

Hello @JordanGabe add this css bottom of file assets > base.css

.banner .banner__content {
align-items: start !important;
}

[PageFly-Richard]

Hi @JordanGabe

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

Additionally, while investigating the issue, I’ve had some suggestions for you, that might help it make your store more profressional.

My suggestion is: to highlight the product price here, and add the review star below it.

Including review stars can enhance customer trust in your product, while highlighting the price will make it easier for customers to locate the product’s pricing.

Hope this can help you solve the issue

Best regards,

Richard | PageFly

[Team_OSC]

Hi @JordanGabe

Online store > customizations > select image banner section > set this (for desktop):

For mobile:

Online store > themes > edit code > assests > base.css > paste this code:

@media screen and (max-width: 768px) {
    .banner .banner__content {
        align-items: start !important;
    }
}

Let me know if it is useful by like and accept my solution.

Regards

Team_OSC

[JordanGabe]

Hey Richard! Thank you a ton for your suggestions and code, the code worked! And I’ll make sure to implement your amazing suggestions, also one more thing how can I stack the the text on the banner “5 Stars” to be a line above “on Google Maps”. Like this:

5 Stars

on Google Maps