Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

blog - preview -card ->solved

ritu jha 60

@ritujha19

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I have a question --> why does my file looks different in edge and different in google chrome .

in edge my files looks prefect but in chrome my files looks different its like look everything goes up .

why does it happens ?

i don't know it happens on only laptop or anyone else also so please, preview my solution if you see this so. Please give me feedback .

OR

if u know why its happened , then please let me know about this also and also u know how to resolved it , so please help me also to resolved it .

Community feedback

khannfouad 230

@khannfouad

Posted

The issue is most likely coming from the 70vh you've set on the container. Different browser's view ports react in different ways when vh is concerned. Also it's a funky property that's why I like to avoid it.

Solution will be to add a max-width property. Use 100vh on the body to center the container div. and remove height altogether from the container. Let your margin and padding handle the vertical length.

Marked as helpful

0

@OmprakashR

Posted

Hi @ritujha19,

Great job on your project! I have a few observations for your code that might help improve it:

Add min-height: 100vh to the body to center the div. Remove the vh value and replace it with px values. Set the height to auto, and use max-height and min-height properties as needed. Additionally, remove the top margin. Hope this helps!

Thank you!!

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord