Steen Toons

@Steentoons
170Points

I am a young front end developer who loves to solve problems and enjoys some challenges in projects

All Comments

    • HTML
    • CSS

    I used atom IDE and The website was created by using html and css

    1
    Steen Toons170 | Posted 4 months agocommented on Reaz Shakil's "Huddle landing page with curved sections" solution

    Hi

    You did a very nice job on following the design... Well done. Try to increase the font sizes a little bit to match the design. Add more padding on the buttons to appear bigger as in the design. Increase the size of the mockup image and add more space between sections to allow more breathing of the design like in the original one.

    Overall, you did a great job!!

    0
    • HTML
    • CSS

    Profile Card Solution

    2
    Steen Toons170 | Posted 4 months agocommented on Sk Saif Ahmed's "Profile card component" solution

    Hi Saif

    I did not find the exact shadow used on the design, but I made one more subtle with more blur and less opacity. box-shadow: 0px 0px 34px -2px rgba(0,0,0,0.27);

    You can use CSS box shadow generators online to create your own better version.

    1
    • HTML
    • CSS

    A Box In A Box

    2
    Steen Toons170 | Posted 4 months agocommented on MrSamich's "Stats preview card component" solution

    Hi MrSamich

    You have done well on the centering of the design to match the original design... You could imrove on your design by using the original colors, forexample using the lighter background provided. lower the top bottom padding of left-section class to make it fit the height of the image, add some border-radius on the pieces to match the design.

    Also you can try to add a colored semi-transparent overlay on the image to change the black and white to match the one on the original design.

    0
    • HTML
    • CSS

    Simple 3-Column Card Layout Using CSS Flexbox

    1
    Steen Toons170 | Posted 4 months agocommented on Lumer Montepio's "3-column preview card component" solution

    Hi zyryle

    I liked your approach of using flex and 100vh... You did a pretty good job in centering the boxes, and the design looks good

    You could improve on it by adding a little bit more padding on the inner elements to provide some more space inside the centered box to match the design even more. Like on the boxes class.

    0
    • HTML
    • CSS

    Practiced flexbox

    1
    Steen Toons170 | Posted 4 months agocommented on Grojd's "Profile card component" solution

    Hi Grojd

    I think you did quite a nice job there, some small tweaks on the inner space, but overall, I think you followed the original design. Keep it up...

    Personally, I like to use % when working with responsive widths. It does some math relative to the parent. I normally use em when working with margins and paddings. I use rems mostly on font sizes, so that when the user changes font size on their browser, your website will adjust accordingly. I rarely use px, I usually converts them to ems. But that is my opinion, you can look more into them and find what woks best for you.

    0