Nishant Shigwan

Latest comments

• 

  P

  Haley Underwood•190

  @underhrSubmitted 5 months ago

  What are you most proud of, and what would you do differently next time?

  I'm most proud of the responsiveness, as this is my first time doing it in a very long time. I look forward to using it in my future projects.

  What challenges did you encounter, and how did you overcome them?

  My biggest issue was learning how to add media queries & what exactly they did, but a few good google searches helped me out.

  What specific areas of your project would you like help with?

  I was able to get the hover effect to fade in when hovering, but not to fade out. It worked on my last project so I'm not sure how to get that working. Not the biggest deal, but if you know how to fix it let me know!

  

  Responsive button links block made using CSS media queries

  2

  20
  

  Nishant Shigwan•70

  @Nishant45678Posted 5 months ago

  1.Remove display and align-items property from the body tag as the margin auto does the same(centering the element).This approach will simplify the code reduce the redundancy. 2.It's a good practice to keep the styles in the external file for better readability and consistency. That will create confusion if you are using both(inline and external) ways together. 3.Apply 1.5em of padding to the body. It will ensure that there will be a space between body and #block element especially for small devices. 4.Use rem units when dealing with typographies and em units when dealing with responsiveness.

  Great job overall, I hope this helps!

  Marked as helpful

  1
• 

  Lauren Delmar•100

  @lrdelmarSubmitted 5 months ago

  What are you most proud of, and what would you do differently next time?

  I am pleased with the structure of my HTML, by adding classes to elements this makes the CSS file as readable as possible and to make the content easier to design. I made sure to list the elements/classes in my CSS files following the structure of the HTML.

  What challenges did you encounter, and how did you overcome them?

  I struggled a bit with choosing the appropriate units for each element to ensure responsiveness. Also when adjusting for media queries I had to go back into my style.css and adjust some of the units I had been using as this affected the layout.

  What specific areas of your project would you like help with?

  Would it be better to make the size of smaller elements like the 'tag' in this project as a fixed size e.g. 50px than set it as a relative %? Have I used @media in the correct way? I had to set max-width for mobile to 376px.

  

  Blog Preview Card

  2

  40
  

  Nishant Shigwan•70

  @Nishant45678Posted 5 months ago

  Your solution fit perfectly for the larger devices but it is not compatible with smaller devices here are some modifications that can enhance the compatibility for smaller devices: 1.Introduce display properties in body selector instead of container selector and you can remove unnecessary rule position:relative from body and container rules. This approach will centralize the container.

  body {
    /*rest of the rules*/
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
  }
  

  2.div.container has by default 100% width

  . card{
  /* rest of the properties*/
  margin :0 auto;
  }
  

  This approach will centralize the card component.

  In line 76 there should be a space I guess between selectors

  And update the width of card accordingly.

  Marked as helpful

  0
• 

  taufanremote•30

  @taufanremoteSubmitted 7 months ago

  

  QR Code with Vanila CSS

  2

  10
  

  Nishant Shigwan•70

  @Nishant45678Posted 7 months ago

  The solution demonstrate the solid understanding of the code structure and the result is closely aligned with the requirements. However I would suggest using em( for relative sizing) and rem( for typography) instead of px. This approach would enhance the responsiveness and accessibility of the design, allowing for better scalability for different screen sizes

  0