Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

HTML site using Flexbox and Media Queries

Chris 20

@cypher618

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


How can I resize the <h1> for smaller screens without triggering a "H1 has already been defined" error?

How can I avoid error for using the universal selector (*) in my CSS?

Is there an alternative for box-sizing to support IE6 or IE7?

Community feedback

P
Matt Studdert 13,611

@mattstuddert

Posted

Hey Chris, nice work on this challenge and congrats on submitting your first solution. Where are you seeing those errors?

To my knowledge, there is no alternative for box-sizing in IE6 or IE7. But my question would be why are you trying to optimise for those browsers? The number of users accessing any site on those browsers would be tiny, so I wouldn't sink too much time into optimising for them. I aim to make sites usable for those browsers, but not optimal.

Keep up the great work! 👍

1

Chris 20

@cypher618

Posted

@mattstuddert hey Matt thank you! I'm using Atom with lint which shows the error in my styles.css.

Yeah, I thought the error with regards to supporting IE6 and IE7 doesn't really matter since most users nowadays are using up to date browsers.

For the h1, I have two in my css. I'm trying to resize it for the 375 requirement of the challenge, so I added another on the media query. I tried targeting it using [class h1] but h1 is a top level. Lint on Atom says h1 was already defined. Is it acceptable to have multiple h1 in css?

0
P
Matt Studdert 13,611

@mattstuddert

Posted

@cypher618 ah OK. Yeah, I'd ignore those errors. It's absolutely fine to select the h1 multiple times in your CSS. It's a very common thing to do, especially if you need to change the styles for responsiveness.

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord