Help with responsive web layout

Design help General
1

28%20PM
28%20PM970×1416 183 KB

I’m having trouble making my site responsive on the home page. I used the Muma template for my portfolio, and it looks fine on the tablet and phone. But once I minimize the responsive web page, the text is off and same with the images. I only have this issue on the home page and not my work or about me pages. Any thoughts on how to fix it? Thanks.

Here is my site Read-Only:

https://preview.webflow.com/preview/lexs-portfolio-68548a?utm_source=lexs-portfolio-68548a&preview=c2b5100548ab2684c16c0b339ba12901

2

Hi @Lex_Walker, thanks for your post. I think the issue has to do with the 50% position offsets on the container center combo class, I assume you are doing this to center the content on the page.

I would probably recommend using flexbox, I made a quick example video:

https://cl.ly/91733bdacf28/Screen%252520Recording%2525202019-03-02%252520at%25252008.31%252520AM.mov

Here is a good page to get example layout structures for your sites: Visual CSS flexbox builder | Webflow

I would also apply a style of overflow hidden to your container class to avoid page overflow due to the images in the columns.

On the column layout, I might recommend to do that layout using entirely flexbox instead of columns, but it is personal preference.

I hope this helps

3

My Left year appreciated this video @cyberdave! hahaha