responsive Article preview component with Html css and vanilla javascr

Community feedback

• 

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted about 4 years ago

  Hey, Degoke! 👋

  Good work on this challenge! Your solution looks good! 👍

  I suggest,

  • Setting a fixed width on the card component so that it doesn't grow too wide when the screen width increases or too squished when the screen width decreases.
  • You can try giving the image a fixed width and allow its height to grow to that of its container, then set the object-fit property to cover or something to make sure the image doesn't distort when the page is resized.
  • Give the author image and the social media popup button a fixed width, too, so that they remain circle-shaped on all screen sizes.

  Keep coding (and happy coding, too)! 😁

  2

  ---

  

  Degoke•210

  @DegokePosted about 4 years ago

  @ApplePieGiraffe Thank you for the feedback, i'll make the changes

  0
• 

  T

  Grace•31,230

  @grace-snowPosted about 4 years ago

  Hi Degoke, I think in the mobile version the share icons are meant to be visible all the time according to the design. In your solution clicking share makes the dark grey block appear over the content so you can't hide it again. I'd have a little look at that.

  Also your circled person image is squashed on mobile. Im not on computer at the moment so can't say for sure why, but it may help giving images like that an exact height and width

  Hope. That's helpful

  1

  ---

  

  Degoke•210

  @DegokePosted about 4 years ago

  @grace-snow thank you, its helpful.

  0