I am currently designing a page for my very first customer project and got stuck with responsiveness. I would want the page to still look clean when viewed on smaller pages, however, when scaling down, the box with text just stays the same and it ruins the aesthetic. I would like for it to stay like that (heading overlapping with picture) at least until mobile landscape if possible. I know that for mobile it probably has to get stacked above each other. Now I am wondering if I maybe had the wrong process to begin with? Anyway, here is my read-only-link. Any help appreciated!
I would take some time to learn what the input values do. Most things that you can do in CSS in code, you can do here visually. So where you have explicit widths set in PX it’s never going to be responsive, as you’re telling that element “Hey, be 400px and don’t move”
You can use %'s and VW a lot more, it will help your design be more responsive.
Here’s a quick video, and check out some of our University tutorials too.
It’s not essential, but if you can at least understand some basic concepts of CSS (without needing to learn the code) it will help you greatly here, as all we’re doing is manipulating real CSS, visually.
thanks a bunch for these handy tips. Should have probably started with more researching more into the different input values. Anyways, your video has helped me out a lot already.
