Centering text in the middle while using text-align: left;

HTML-CSS
1

I’m stuck on how I would do this.
https://jsfiddle.net/h7bysvma/7/

  .window {
    display: table;
    text-align: left;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 1px solid green;
  }

  span {
    display: table-cell;
    vertical-align: middle;
    font-size: 18px;
    color: red;
  }

<div class="window">
  <span>Console <br>
  Something<br>
  Sports <br>
  Display<br> 
  Text <br> 
  Settings</span>
</div>
2

Hello;
If u want to bring text inside the circle, then use the padding style in span.like give the value for padding-top and padding-left.
Hope it helped.

3

If this is what you are going for, you can use a flex based layout
image

.window {
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 1px solid green;
}