How do I get two columns of image and text to be responsive in parallax theme blog post?

[lightmove]

Apparently the Out of the Sandbox Parallax Blog posts have different functionality to the Pages, but I would still like to have an image adjacent to text in my blog posts.  I would also like the text to be responsive on desktop (wrap until my browser window is the size of mobile) and, of course, stack on mobile.  Currently, none of these solutions have worked.
1.  <!-- split --> tag (no impact)

2. <div class="image-with-text__image-column two-thirds column medium-down--one-whole"> (looks good on mobile, but text only wraps for a limited range of desktop windows... and then jumps to a stack prematurely)

3. placing a variety of chatgpt styles above and below the blog post to force the correct formatting. (all kinds of problems)

The Out of the sandbox videos and chatgpt have led me astray, humans to the rescue! Pretty please! I am clearly not a developer, but have limited ability to place HTML code. Thank you!

[Abdosamer]

Hi @lightmove , can you share your store url?

[lightmove]

sure - thanks for taking a peek! Here is the page I'm working on right now: https://lumenkind.com/blogs/mindful/receive. Here is the current code I'm using for the image/text blocks: 

<div class="page-details-block" style="text-align: left;">
<div class="container">
<div class="homepage_content section clearfix image_with_text">
<div class="image-with-text__text-column one-third column medium-down--one-whole"><img src="IMAGE" alt="" class="lazyload transition-in" style="margin: 30px 50px 30px 0px;"></div>
<div class="image-with-text__image-column two-thirds column medium-down--one-whole" style="text-align: left;">
<h2><b>TITLE</b></h2>
<p style="text-align: left;">COPY</p>
<a href="LINK" style="margin: 30px 0px 30px 0px;" class="action_button">Discover Key Practices</a></div>
</div>
</div>

[Abdosamer · Accepted solution]

@lightmove , go to styles.css and add the following code:

.homepage_content.section.clearfix.image_with_text {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

[lightmove]

nice!  🙏 I'm not familiar with adjusting styles.css.  By adding this code will I mess up other parts of my website?  Potentially fixing the blog issue and breaking something else?  Sorry - this is all new for me, so I just want to make sure I'm asking for the right help,  Thank you!

[Abdosamer]

@lightmove , This code is just for the homepage, it will not mess up any other parts.
To adjust styles.css you can go to your admin and click on Edit code:

open your assets folder and search for styles.css file :

and simply add the code at the end of the file.

[lightmove]

oh - got it. thanks for clarification. The page I'm working on is actually a BLOG post, not the home page.  Is there a way to insert this style code so it only impacts the blog posts?

[Abdosamer]

@lightmove , The code will work for the blog posts.

[lightmove]

great!  I have found what I believe is the correct area to paste the code.  What I see here is there is already a little piece of what could be previously input custom code that may be the culprit.  So two questions:  1) Are there any other considerations now that you see lines 13920-13923?  2) Should line 13925 say something about article rather than homepage?  Since I only want this style to impact the functionality of my blog posts not anywhere else on my website?  Thanks for your help and patience!

[lightmove]

great! so in looking at the location of the code. I have two additional questions:
1. Are there any additional considerations seeing the previously input custom code starting on line 13920? 
2. the code that you provided says "homepage." since I only want this to impact my blog posts and not my home, do I need to change this in some way? 

thank you! 

[Abdosamer]

@lightmove ,
1-No, you don't need to worry about this code.
2-The code says homepage but it is actually affecting the blog posts page.

[lightmove]

Thank you so much for your help and your patience as I confirmed everything was set up correctly!  I really appreciate it.  Everything seems to be working better now without any issues on the home page.