Help! how to create a splitscreen section

Site URL: http://www.goodstuff.ventures/

Hi,
I created a split screen section for a website, but the code does not work very well. I have issues with the height - sometimes  the content overflows and is then hidden.

Is there a way to create this, as a code block for example? 
It is not the usual splitscreen, with one image and texts. 
I need a different background color for each part, and they have to be outlined in yellow (designer's wish).
you can see what I did in the link provided, and
here is an image:


I

Any idea how to do this ?
Is there a simple way using a code block, hardcoded ?

hi @GSv - Your website looks exactly like the image you shared... it looks like you were able to achieve what you're looking to do... ? 

ha I am just fixing that with someone's help 🙂
but it is quite complicated to achieve apparently.
Almost there !

@GSv great! I know you're trying to use a code block to achieve this, and have mentioned that you didn't want to use image blocks. But you can definitely use image blocks (portrait layout) but then you hide the images and add a background to each of these images separately and it is quite easy. You can also add a color hover effect if you want the color to change when hovering over the content. 

If you can, share how you fixed it 😉  and good luck! The site is looking great!

Thanks for the suggestion - I wasnt aware using image blocks you can add text over it, using the full width and achieve this. 
I will check that out!

Edit: the responsiveness has still to be fixed - once I got this, I will share the code!

@lu.diehl I ended up using help from https://www.will-myers.com/ - so I cannot really  share his code here, that would not be fair for his hard work 🙂

On 7/7/2020 at 2:52 AM, GSv said:

@lu.diehl I ended up using help from https://www.will-myers.com/ - so I cannot really  share his code here, that would not be fair for his hard work 🙂

Of course! I'm just glad that you found help and were able to get it done! 😉  👏