Skip to content
Submitted over 3 years ago

Nearly no use of classes and IDs in HTML

Sven•295
@Sven72
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Pricing component with toggle
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

It would be great if I could get feedback relating to the codestructure. How can I improve it so that it become professional and maintable? Also there is an issue with the Dollar Sign and the price. Because the "$" is not vertically centered. I have no clue how to accomplish this? Best and stay healthy

Community feedback

  • Bonrey•1,130
    @BonreyPosted over 3 years ago

    Hi, Sven! The website looks pretty cool! However, on my laptop (with the screen width of 1280px) I see the mobile design, which isn't good :( So, I suggest you make the mobile breakpoint closer to 600px or something like that. And simply reduce the components' size and fonts for the screens like mine. As regards the dollar sign, I'm not sure but I think you can try adding to your dollar span "line-height" property equal to the parent's height (in your case, it's "p"). And it should help to vertically align the dollar sign.

    See this great article for further details: https://css-tricks.com/centering-css-complete-guide/

    1

Please log in to post a comment

Log in with GitHub

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