When using media queries is it better to have them throughout the css file or put them all at the end together?
Aron Snekkestad
@aronsnAll comments
- @MonstersInc-sudoSubmitted 10 months ago@aronsnPosted 10 months ago
Depends on how you have structured your styling. When styling a page it is common to follow mobile-first design, and usually when your page/app is mobile-first, you put all media queries in the bottom of the css file in with all the the break points in an ascending order.
Marked as helpful0 - @GrathienbetoSubmitted 12 months ago
Difficulties about this project.
I've been away from CSS for a long time, so remembering a lot properties was a challenge.
God bless mozilla dev
Which areas of your code are you unsure of?
I'm not unsure, but more of "This could easily be better organized" about my HTML tags and my CSS. Im pretty sure i repeated myself a lot. It could use a refactor, but considering is a small project i think i can move on.
Do you have any questions about best practices?
Yes, a lot.
- Span vs paragraphs / headers in small sentences or just one word.
- Best ways to aproach CSS
- Name conventions
This three just for a fast start.
@aronsnPosted 12 months agoHey, awesome solution!
I think you pretty much nailed the looks from the design.
Now, I am no expert but there are some things I try to be vary of when I go on about building a simple page. I have only 2 points for you.
-
When it comes to html heading tags, make sure to always start with <h1>, and then follow it up with the smaller heading tags e.t. <h2>, <h3>, etc. Try to keep the heading numbers sequential if you have many headings. But never place a lower heading tag before a higher heading tag, in your case: h4 before h3.
-
Do not use <span> tags, inside <span>. Thats what we have <div> for. I usually only use span when I want to manipulate text inside headings or paragraphs
Not a super biggie, but I think it something everyone should know when it comes to html. Either way, I think your solution looks great.
Feel free to have a look at my solution for this challenge too. I can use some feedback on things to do differently for next challenge!
Marked as helpful1