Skip to content
OverviewSolutions
13
Comments
23
Vincent Daniel
@davinceey

All comments

  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello @FHER AMABLE RICSE. Great solution you have here (I just completed mine too😆) As concerns your question, it would be preferable if you use CSS Selectors and pseudo elements to change the color of your placeholder. This can be done by using this ::placeholder. So to change it's color, you do this:

    ::placeholder{
color: black;
}

    This would enable your Javascript code to be cleaner.

    Hope this helps you. Happy Coding!

    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Mohit. Congratulations on your first project! This is apt and great on the whole. Just some little tips for improvement:

    1. You might want to replace the p tag used in the first write-up, with a h1 tag, so that your <main> tag, has a level-one heading.

    2. You might as well, want to use more of relative units such as the em and rem in applying to padding, margins, widths and font-sizes. This would help to increase the responsiveness of your layout.

    You did very well. Keep up!

    Hope this helps you. Happy Coding!👊

    Marked as helpful
    1
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Akinrinlola olamide. Congratulations on your first project! Just some little tips for improvement:

    1. You could make use of the display: flex to centralize your solution. You could make use of this code:
    body{
display: flex;
justify-content: center;
align-items: center;
}

    1. You could wrap all your content with the <main> tag and then make use if the h1 tag as a level-one heading. It would be perfect if it replaces the h3 tag used in your code and it would help in improving Accessibility.

    2. You could also make use of relative units like the em and rem units for your font-sizes, padding, margins and widths. This would help to improve your site's responsiveness.

    Hope this helps you. Happy Coding!👊

    Marked as helpful
    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Nicolás Hernández. Congratulations on finishing this project! I previewed your site and it looks very good. But I observed that it wasn't responsive when I used my Chrome Dev Tools.

    You might want to go through your media query code. You used min-width: 1440px, instead of setting how it should look on a mobile layout (375px). This made your site have issue with being responsive.

    You might want to also make use of relative units like the em and rem to replace the px when applying to padding, margins, font-sizes and widths, as this would help improve their responsiveness.

    Hope this helps you. Happy Coding!👊

    Marked as helpful
    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Ammar Khalid. Congratulations on finishing this project! And, yes, your solution is clean😁. Just some little tips for improvement:

    1. You could do well to wrap all your content in a <main> tag. You made use of a lot of divs. You could just make use of a <section> tag to group your work just right under the svg.

    2. I observed that your writeups were not wrapped in any tags. It would be good HTMML practice to wrap your codes in tags. Your should use this instead <h1>Improve your front-end <br> skills by building projects</h1> and a p tag for the second write-up.

    3. You could also make use of relative units like the em and rem for padding, margins, and widths. This would enable your site to be more responsive.

    Hope this helps you. Happy Coding!👊

    Marked as helpful
    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello EnD1nG. Congratulations on your first project! Your solution is nice and great in the whole. Some little tips for you:

    1. You could do well to wrap everything in a <main> tag instead. This would help in good HTML validation and would also help screen-readers to know that they are about going through the main content of your site. Also, you could replace the div in this code <div class="card-inner">, with a section semantic tag. This would help to improve Accessibility.

    2. You can replace the h2 tag with an h1 tag so that it obeys the HTML hierarchy, giving your code a level one heading.

    Hope this helps you. Happy Coding!👊

    Marked as helpful
    1
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Atanu Malik. Congratulations on finishing this project! I just previewed your site and it is beautiful. I saw the hiver effect used on the image, so apt!😁 I just have a small tip actually:

    You might want to replace your h3 tag with the h1 tag and then, you can set the font-size of your body to inherit so that you can set the font-size of your h1 to what you want (this is totally optional). But changing the h3 to h1, would be good HTML practice as it obeys the order of hierarchy.

    Hope this helps you. Happy coding!👊

    Marked as helpful
    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Mazz Ghani. Congratulations on your first project! Some tips for you:

    1. You might want to wrap your entire code with the <main> tag. You can also use <section> tags to partition your layout. This would improve Accessibility.

    2. You made so much use of h4 and h5 which was not good HTML code practice. You should instead use the h1 tag as it obeys HTML order hierarchy.

    3. You can as well apply this to the body tag:

    body{
   display: flex;
   justify-content: center;
   align-items: center;
   min-height: 100vh;
}

    This would help in centralizing your project.

    Hope this helps you. Happy coding!

    Marked as helpful
    1
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Giovanni. Congratulations on your first project! This is a beautiful design on the whole. Just some little tips to help: You might want to replace the p tag in this code <p id="title">Improve your front-end skills by building projects</p>, with a h1 tag. This would help improve Accessibility as your article semantic tag, would have a level one heading.

    Hope this helps you. Happy Coding!👊

    0
  • Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello Gustavo Costa!. Congratulations on your first project! It's a wonderful one on the whole! Just some little tips for you:

    1. You might want to replace the <section> tag used to wrap everything, with a <main> tag and then, use the <section> tag to replace the numerous divs used to partition your layout. This would help to improve Accessibility

    2. From your code, <span><h1>SUVS</h1></span><br />, you placed h1 inside a span which is not a good html practice. You could do well to remove the span as it causes inadequate HTML validation.

    On the bright side, this is a beautiful project! Well-done.

    Hope this helps you. Happy Coding!💖

    Marked as helpful
    1
  • StrawHatCoder•10
    @StrawHatTeamItSubmitted about 2 years ago

    Hello , This my first challenge in Frontend Mentor so if you have any advice to improve the code please tell me so i could update it thank you.

    Qr Code Challenge

    3
    Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello StrawHatCoder. Congratulations on your first project! It looks wonderful on the whole. Just some little tips:

    I tried using the Responsive tool on my Chrome Dev Tools and at width: 1440px, your solution becomes very much magnified that it loses it's form. You might want to look at your media query code @media screen and (min-width: 1440px) and change the min-width to max-width.

    Hope this helps you. Happy Coding!💖

    Marked as helpful
    1
  • shalash23•280
    @shalash23Submitted about 2 years ago

    If anyone can comment on the mistakes that had been made, I would really appreciate it.

    Are the media queries correct?

    Is it responsive on all different devices?

    QR Code Component

    3
    Vincent Daniel•410
    @davinceeyPosted about 2 years ago

    Hello shalash23. Congratulations on your first project! Some little tips for you:

    1. You might want to wrap all your content in a <main> semantic tag. You could also make use of <section> and/or <article> semantic tags. This would help to improve Accessibility.

    2. Your images, should have alternative texts as well alt ="".

    Hope this helps you. Happy Coding!💖

    Marked as helpful
    0