@wendyhamel
Posted
Hi, I've got some issues you might want to take a look at.
The page is not showing properly on mobile size. The content gets cut of on top and you can not scroll to it. It's because of the height: 100% on main.
The image gets squashed or stretched on some screen sizes. You can use object-fit for that. probably with `:contain;' , but you should plaay around what works best in your solution on the different screen sizes.
It also looks like the header and stat-headers are bolder in the design than in your solution.
Hope this helps you along.
Happy coding!
Marked as helpful
@munyite001
Posted
@wendyhamel... Hadn't noticed that, thanks, I have worked on it. Maybe you can check it out to see if it's okay?!
@wendyhamel
Posted
@munyite001 Yes! You fixed the scrolling and you fixed the stretching on mobile and larger then 1400px screens. It's still squashed between around 800px - 1300px however.
And there are a few more:
- some text overflows slightly near 800px
- there is now a narrow purple line at the bottom of the image on mobile, a difference between the image size and the background of the image-container.
- the color of the image is different from the design. You might want to explore another way of getting the purple mixed with the image. Like background-blend mode.
Just some minor adjustment needed! I hope you don't mind me pointing these out to you. Doing great!
@munyite001
Posted
@wendyhamel...Hey I don't mind at all. I have worked on the issues you have mentioned, apart from the color in the image. I have never used the background-blend property, but I'll start experimenting with it, then I'll implement it on the card
