Jump to content

How to round an image


newcoder1010

Recommended Posts

Hello,

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
img {
  border-radius: 50%;
}
</style>
</head>
<body>

<h2>Rounded Images</h2>

<img src="/sites/default/files/2022-12/bg-house.png" alt="Avatar" style="width:200px">

</body>
</html> 

Original image

https://ibb.co/zH7HXfg

Round image after styling. It looks oval shape.

https://ibb.co/YpSBKw5

How can I round the image like this one in below?

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_rounded_images

Edited by newcoder1010
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...