Skip to content
OverviewSolutions
27
Comments
11
Paul Adekomi
@Paul-Adek

All comments

  • Ashong•930
    @AshongAbdallah06Submitted 11 months ago

    This has to be my best work ever. I managed to make it responsive across 15+ devices. Any suggestions would be greatly appreciated.

    Insure Landing Page

    1
    Paul Adekomi•550
    @Paul-AdekPosted 11 months ago

    Hi there, good job on getting this project done, The font size looks small on my screen, Make the font size more bigger for easier readability, In all this was a good one. HAPPY CODING.

    0
  • Paul Adekomi•550
    @Paul-AdekPosted 11 months ago

    Good Job on getting this project done Luke Song, I suggest that you would have wrap your content inside a div for example:

    <body>
	<div class="container">
         <--! Content goes here -->
       </div>
      </body>

    then style it like this

    body{
     display: flex;
     align-items: center;
     justify-content:center;
     min-height : 100vh;
  }
.container{
      display: flex;
      align-items: center;
      justify-content:center;
      flex-direction: column;
      height : 100vh;
      width:100vh;
}

    This will help in making it responsive. Anyways, you did a good job on this, I hope this helps.

    0
  • Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Hi there, Good job 👏 on completing the project, But it seems that you did not upload your image file when trying to upload the project on GitHub, so next time make sure you don't forget the images file. Just an advice, All the best, Happy Coding 😎

    0
  • Einars•60
    @EinaroksSubmitted over 1 year ago
    • Hardest thing was to get the "add to cart" icon aligned with text (still don't know how to achieve this without using absolute positioning).
    • Have no clue how to center the smaller old price tag to the right of the actual price.
    • Is there a better way to implement the "add to cart" icon?

    Product Preview Card Solution using grid

    3
    Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Good job 'EINAR , Concerning the cart image, you can use flex property (CSS)

    display: flex;
align-items: center;
justify-content: center;
}
button img {
width: fit-content;
margin-right: 5px;
}

    and HTML

    <button><img src="images/icon-cart.svg" alt="image">Add to Cart</button>

    I'll say that you should learn more about CSS flex property I hope this helps. Happy Coding.

    Marked as helpful
    0
  • Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Hi Legend, Good job, 👏, I just wanted to advise that you should use grid to make it more (mobile screen s) responsive, cos that what I do use, Nevertheless, you did a great job there😀😀. I hope this helps, Happy Coding 😎😎

    5
  • Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Good job Meriem 👍👍, just want to add that you should use the :hover selector to add an effect when we move a mouse over an element

    <html>
<head>
<title> Try It Yourself </title>

</head>
<body>
<button id="button1"> Button </button>
<button id="button2"> Button </button>
<p> Since we can't mouse over a button in mobile you can try to click and hold the it to see the effects. </p>
<p><b> Tip! </b> Remove the transition duration properties or set them to <b>0s</b> to make a "pressed effect".</p>
</body>
</html>  ```
    0
  • Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Hi Oswaldo you did a great job 👏👏 But you should really have added more padding. Also use the :hover selector to add an effect on when we move the mouse over the button e.g button { background-color: red; } button:hover { background-color: blue; } I hope this was helpful. Happy Coding 👍😄😄

    Marked as helpful
    1
  • Paul Adekomi•550
    @Paul-AdekPosted over 1 year ago

    Well done ARZU475, Nice work there, but concern the icons you should have done them like this <li><a href="#"><i fa-brands-fa></i></a></li>, Anyways you did a good job, I hope this is helpful. Happy Coding!

    Marked as helpful
    0
  • Paul Adekomi•550
    @Paul-AdekPosted almost 2 years ago

    Hi mohamed ibrahim, Great job there, You should use CSS (:hover) pseudo-class to change an element's styles when the user's pointer hovers (mouses over) it. For more you can check mozilla developer network, copy this link (https://developer.mozilla.org/en-US/docs/Web/CSS/:hover). I hope this was really helpful?.

    Happy Coding!

    Marked as helpful
    0
  • Paul Adekomi•550
    @Paul-AdekPosted almost 2 years ago

    Hi Tunde, Great job there, You should use CSS (:hover) pseudo-class to change an element's styles when the user's pointer hovers (mouses over) it. For more you can check mozilla developer network, copy this link (https://developer.mozilla.org/en-US/docs/Web/CSS/:hover). I hope this was really helpful?.

    Happy Coding!

    Marked as helpful
    0
  • Paul Adekomi•550
    @Paul-AdekPosted almost 2 years ago

    Nice work Minilik Zeru . You should use CSS (:hover) pseudo-class to change an element's styles when the user's pointer hovers (mouses over) it.

    Marked as helpful
    0