@timavidon
Posted
To achieve this you need to do it on the img itself.
try to do,
#scanqr img {
border-radius: 30px
}
you can also do,
img {
border-radius: 30px
}
Marked as helpful
@Nelson-elci
Posted
@timavidon Thanks, it worked.
I couldn't add border-radius to the Scan QR image. I tried with border-radius: 30px; but no effect. How do I achieve that?
@timavidon
Posted
To achieve this you need to do it on the img itself.
try to do,
#scanqr img {
border-radius: 30px
}
you can also do,
img {
border-radius: 30px
}
Marked as helpful
@Nelson-elci
Posted
@timavidon Thanks, it worked.
@Zy8712
Posted
There are two ways you can apply border radius to your image. The first way is to apply the border radius directly to the image itself using:
img{
border-radius: 30px;
}
Alternatively, you can apply border radius to the div surrounding your image and then use overflow: hidden
to stop the edges of the image from going outside of the div. In your case:
#scanqr{
border-radius: 30px
overflow: hidden;
}
Hope his helps 👍
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