Hello this is my solution to the landing page challenge ✌️ i had some trouble with the following :
the website stretches beyond 1440px which leads to distortion in layout
the icons needs to have a circular border with hover effects ( when the border is added they become oval and when i add border-radius:50%; aspect-ratio:1;
it still doesnt solve the oval shape around the icons
the grid content area in desktop mode isnt fitted well as the design
had trouble adjusting the content area in desktop mode ( width and height )
@arkaroy135
Posted
Hey Abdelrahman, you did a fine job. However, use
body{
min-width: 100dvh;
min-height:100dvh;
}
for solving the overflow issue. dvh or dvw units are better at handling the overflow issue. Check my code to solve your icon issue. PS, I also have that overflow issue which I didn't fixed yet.
Marked as helpful
@Dribbz
Posted
Hey Roy i will give your code a look and try to fix my mistakes.
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
