I'm trying to show a text inside a circle and I found the following code.
The problem is that I would like:

* the circle aligned horizontally in the center of the page
* the text aligned vertically in the middle of the circle

[JsFiddle here](https://jsfiddle.net/bvh1243n/1/)

code:

```css
.fancy {
  /* Within a circle, centered text looks prettier. */
  text-align: center;
  /* Let's avoid our text touching the border. As
         our text will still flow in a square, it looks
         nicer that way, giving the feeling that it's a "real"
         circle. */
  padding: 1em;
  /* The border will make the circle visible.
         You could also use a background, as
         backgrounds are clipped by border radius */
  border: 0.5em solid black;
  /* Let's make sure we have a square.
         If it's not a square, we'll get an
         ellipsis rather than a circle ;) */
  width: 8em;
  height: 8em;
  /* and let's turn the square into a circle */
  border-radius: 100%;
  vertical-align: middle;
}
```

```html
<div class="fancy">something</div>
```