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

Summary Component Using Flexbox

Celine Tranβ€’ 120

@CelineTrann

Desktop design screenshot for the Results summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Is there a better way to style the red, yellow, green, and blue boxes so that the spacing remains more consistent with varying screen sizes?

How do you determine what html tag to use with text (eg. p vs. h1 vs. div vs. etc...)?

Community feedback

Adelβ€’ 820

@Adel-Harrat

Posted

Hey there! Congrats on completing this challenge 😍

When it comes to organizing my HTML content, I've got a specific way of doing things:

First off, for the big, important title, I like to use the <h1> tag. It really stands out and shows that it's the main heading on the page.

Next up, when I have secondary titles that aren't as crucial, I go with the <h2> tag. It helps give them a bit of importance but not as much as the main title.

Now, when it's time for longer paragraphs, I turn to the trusty <p> tag. It's perfect for fitting in those chunks of text.

But sometimes, I want to put emphasis on just a few words or phrases. That's when I bring in the <span> tag. It's great for highlighting those short bits.

Oh, and one more thing! I try to stick to semantic HTML and make things accessible. So, unless I really need them for specific layouts, I tend to avoid using <div> tags.

By sticking to this approach, I make sure my HTML looks good, stays organized, and is easy to understand. πŸ˜ŽπŸ‘‹

0

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