dawn theme - aligning text and image side by side

[neji-jewelry]

Hi,

I need some help with my site - I'm trying to get the text to align on the right hand side of the page - to the right of the image -

 

I added this code to the base.css which moved the image to the right place but not the text: 

/* Ensure no other styles interfere by using higher specificity */
div.about-section {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
justify-content: space-between !important;
margin: 20px 0 !important;
}

div.about-section div.about-image {
flex: 1 !important;
max-width: 45% !important; /* Adjust percentage as needed */
margin-right: 20px !important;
}

div.about-section div.about-text {
flex: 1 !important;
max-width: 45% !important; /* Adjust percentage as needed */
text-align: left !important; /* Ensure text alignment is on the left */
}

div.about-section div.about-image img {
max-width: 100% !important;
height: auto !important;
}

FYI - I updated the HTML for this page to this: 
<div class="about-section">
<div class="about-image"><img alt="About Us Image" height="452" width="389" src="https://cdn.shopify.com/s/files/1/0576/8619/6294/files/about.aya_600x600.jpg?v=1705370313"></div>
<div class="about-text">
<p>my text goes here.................</p>
<p class="p1"><strong><i>Neji: </i>Japanese for <i>twist/screws</i></strong></p>
<p class="p2">my text goes here..................</p>
</div>
</div>

[PageFly-Noah]

This is Noah from PageFly - Shopify Page Builder App

I can help you. Please can you provide the website url. Thank you.

Best regards,

Noah | PageFly

[Dan-From-Ryviu]

Hi @neji-jewelry 

You can do that by clicking Add section > select Image with text to have a section image side by side with text. 

[neji-jewelry]

hi @Dan-From-Ryviu , thanks for this - the problem is that when I do it this way - it customises the whole theme and it's then appearing on every page, instead of only on the 'about' page.  Do you know how I can fix this?

[Moeed]

Hey @neji-jewelry 

Share your Store URL and Password if enabled.

Best Regards,

Moeed

[Dan-From-Ryviu · Accepted solution]

You can create a new template for about us page so that section will not be applied to other pages. Please check this to learn more 

https://help.shopify.com/en/manual/online-store/themes/theme-structure/templates

[Vinsinfo]

@neji-jewelry The code you provided is working for us, find the attached image below. Please provide your store URL to check why it is not working in your store.