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

Mobile-first design using Flexbox

tbrownlee 350

@tbrownlee

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Did I underline the "Change" link correctly, since the underline seemed to be very close to the word. I used the text-underline-offset property.

Community feedback

P

@12Kentos

Posted

Code looks pretty good to me! I don't think the underline property was actually needed here. One thing I did notice is you used <a> to change the properties of your link. Granted this was the only link in your html, but if you were to want to use a link somewhere in the future, this would affect all of your links. Where possible it is generally better to use a class to select and change features like this. Hope that makes sense!

Marked as helpful

1

tbrownlee 350

@tbrownlee

Posted

@12Kentos thanks for your advice! I'll get rid of the underline property.

You're right, I got lazy on the <a> element. In this scenario, which is better:

-Put a div to wrap the link with a class of, say, "link" and then do .link a {} in css?

-Or should I put a class directly in the <a> element?

0
P

@12Kentos

Posted

@tbrownlee I think that comes down to personal preference, personally I would put it in the <a> element itself, as you are likely to have other links on a webpage that you would like styled in the same manner.

This makes your code more reusable, and in my opinion easier to maintain.

Marked as helpful

1
tbrownlee 350

@tbrownlee

Posted

@12Kentos ok makes sense! I fixed my code. Thanks again.

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