CSS Circle with border

Question

Every guide I find has the line and fill the same colour. All I want is a circle with a red line and white fill.

I have tried:

.circle {     border: red;     background-color: #FFFFFF;     height: 100px;     -moz-border-radius:75px;     -webkit-border-radius: 75px;     width: 100px; } 

But cannot get the red border?

Answer 1

You forgot to set the width of the border! Change border: red; to border:1px solid red;

Here the full code to get the circle:

.circle {      background-color:#fff;      border:1px solid red;          height:100px;      border-radius:50%;      -moz-border-radius:50%;      -webkit-border-radius:50%;      width:100px;  }

<div class="circle"></div>