What are you most proud of, and what would you do differently next time?
none
What challenges did you encounter, and how did you overcome them?
Alot
What specific areas of your project would you like help with?
I would appreciate help with adding a background image to the body element. Despite using various properties, I was unable to achieve this. Additionally, I struggled to add a border radius to only the upper part of the image and found it very difficult to center everything. Any advice would be greatly appreciated. like i'm beginner si this was veru tough project i ever done, i only use flex box maybe thats why
@jpdavalos423
Posted
Hey Munib! Great work on this challenge. As for adding a border radius to only the top corners of the image consider this example:
border-radius: 20px 20px 0px 0px;
The border-radius property in this example uses 4 arguments each representing a different corner. The arguments start at the top-left corner and follow clockwise. Be sure to adjust the numbers accordingly in order to fit your implementation.
Marked as helpful
@ShoaibShuja
Posted
Your live site is showing an error and is not loading.
But you can add a background image by using these lines of code:
body {
background-image: url("./assets/images/yourImageFile.png");
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
Note this that you have to type your image file's name where I wrote yourImageFile.png.
Marked as helpful
@ShoaibShuja
Posted
And one more thing if you want to put a container in the middle of the web page remove the container's margin and put these lines of code in your css stylesheet:
body {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
min-height: 100vh;
}
@MunibAhmad-dev
Posted
Thank you very much for your help! Actually, I used all the properties except background-repeat, so the image shows 2-3 times. But indeed, you helped a lot. Thanks again!
One more thing: for centering the main div, should I center it by targeting the body element directly?@ShoaibShuja
@ShoaibShuja
Posted
Yes, my friend.
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
