I have spent some time trying to work this out but with no luck. I’m trying to align the text elements along side the image like this picture below. I was able to do this with absolute positioning.
However I also want my page to be responsive so I decided to use a flex box container to put the text elements and the image elements side by side and get the equal distancing when I resized the window. However when I increase the size of my image the content area just ignore its padding margins and parent container. It creates a scroll on the window width and a plain white background.
Would love to hear what people think I’m doing wrong. Would also like to hear any other ways that people would go about creating the desired effect I’m looking for.
This is my code below