Change border-radius
to 150px
#circle{
height: 300px;
width: 300px;
background-color: red;
border-radius: 150px;
}
The radius should be the half of the width or height . Also both the height and width should be equal
Otherwise you can put border-radius
as 50% , border radius is directly correlated with the elements width.
#circle{
height: 300px;
width: 300px;
background-color: red;
border-radius: 50%;
}