Responsive Article Preview Component(CSS Grid-Flex Layout)

Community feedback

• 

  P

  Jax Teller•670

  @piushbhandariPosted 10 months ago

  1. set margin: 0 auto; on the body element so your component is centered on larger screens
  2. this isn't responsive to small to medium sized tablet users. i would suggest having your media query be about 768px instead of 375px. additionally add side paddings to your body element so the component isn't hugging the edges of the screen.
  3. when the pop up is active, it ruins the responsiveness of your component. i would advise rearranging your markup so that the popup is inside your section element and giving that section element position:relative; you may need to play around with this.

  when looking at the graphics, you don't need to restrict yourself to 1440px and 375 since that's what they have mocked up on the graphics. i would suggest studying more on making things responsive as that's the glaring issue with this.

  you have a good grasp on using semantic elements. once you solve the responsiveness issue that should be big step up for you.

  hope this helps.

  Marked as helpful

  0