All comments

• 

  Barish Barla•40

  @Valac01Submitted about 2 years ago

  I've added some animations, I wanted the animations to be subtle. Were these okay or too much.

  

  Interactive rating component with animations

  1

  30
  

  Aurel•290

  @Aur71Posted about 2 years ago

  They are good, dont worry

  0
• 

  Donn O'Lochlainn•20

  @donnol87Submitted over 2 years ago

  This one was pretty tricky. I still don't think it's fully responsive and I had to hard code some of the css for items to appear where I wanted them. I also struggled to get the fonts I wanted in VSCode.

  Although I used FlexBox for this exercise, I still had to move items around with margin, padding etc to get them where I wanted them.

  This doesn't seem right but the final product is almost good enough.

  As always, please share any feedback so I can continue to grow as a front-end-developer.

  Thanks all,

  Donn

  

  Perfume Challenge

  3

  20
  

  Aurel•290

  @Aur71Posted over 2 years ago

  Using padding and margin is normal, so dont worry about it. Also when you downlad the starter files there is a styling guide. There you will find the colors and fonts used in design.

  0
• 

  Hafsat Nasidi•60

  @hafsatun2020Submitted over 2 years ago

  I couldn't figure out how to increase the space between price and Annual plan.

  I would appreciate if someone could help me out with that. thank you

  

  Order-summary-component html5 and css

  2

  40
  

  Aurel•290

  @Aur71Posted over 2 years ago

  Put bouth of them inside a container.

  .container { display: flex; gap: 10px; }

  Or you can just use margin-top on the price and margin-bottom on the text.

  Marked as helpful

  2
• 

  Billy•40

  @DavincyProjectSubmitted over 2 years ago

  can someone explain to me how to replace images with css or whatever u know, from desktop images to mobile images

  

  Using Flexbox

  3

  30
  

  Aurel•290

  @Aur71Posted over 2 years ago

  Put bouth images inside your img-container. To the desktop image give an id = "desktop-img". To the mobile image give an id = "mobile-img"

  #desktop-img { display: block; } #mobile-img { display: none; }

  Now you just have to use a media querie so you can switch the display when you hit a break point.

  @media only screen and (max-width: 600px) {

  #desktop-img { display: none; } #mobile-img { display: block; }

  And last change the direction of your container

  .container { flex-direction: column; } }

  Marked as helpful

  1
• 

  Jacob Marshall•270

  @JacobMarshall0Submitted over 2 years ago

  How can I develop code for better accessibility?

  

  Responsive Product Card design using flexbox

  1

  60
  

  Aurel•290

  @Aur71Posted over 2 years ago

  For better accessibility use semantic html, like header, main, footer, etc (in this case i think you shoud wrap all the content in a <main> element). Is good practice to only use a slinge <h1> on your page for your most important title . Also use the alt attribute from your images.

  Marked as helpful

  1