The photo in the about section will probably not dispaly for you, I am working on that, just need to get a nice picture
The code is comlete spaghetti, I was trying a lot of different thing while working on it and I probably got a little lost in the weeds, I am actually thinking of just redoing it from scratch now that I know what I want to do with the design, but I would appreciate some tips on keeping your CSS and HTML nice and tidy.
I also wanted to ask, what is a best-practice way to target mobile screens in media queries? Like, don’t mobile screens all kinds of resolution ranging from 4k down to something like 720p or below? What is the bext way to get them all?
There are HTML coding errors you should be aware of and address.
Since copy/paste from codepen you can ignore the first warning and first two errors.
Start with the narrow view (mobile) design first and then work your way wider, adding breakpoints where needed for the wider design.
Doing it this way you’re not so concerned about what has which breakpoint you’re concerned with where to I need to create a breakpoint so that my design holds up for different screen widths. You’ll have all your projects stacked for the narrowest. As you widen the screen what what point would you want two across? Is there a point where you’d want three across?
It also helps with responsiveness if you use relative units rather than hard coding pixel values.
Thanks for the feedback that was really helpful.
Yeah, I’ll definetly need to look into doing values in em, that’ll be one of my goals in future projects.
I kind of did start from the narrowest screen width with this project and worked my way up from there, but is there a generally agreed width that you should first target? For example, my phone is 1080p across in portrait mode, buth that is obviously too wide to target first, because there are phones with lower resolutions, but how small should I go 720p? 480p? Or should i just go as low as posiible since that will not really matter?