ul bullets not aligning - html

Question

I've been trying to use
<ul style="text-align:center">
<li> 1794 - born in Berkeley, UK </li>
<li> 1821 - began his training as a doctor </li>
</ul>
Unfortunately, neither bullets and text align correctly, I've tried using divs and it still doesn't work.
This is what is happening:
This is what I want:

Answer 1

Try this simple code snippet
ul {
display: table;
margin: 0 auto;
}
<ul class="list">
<li class="list-item">1794 - born in Berkeley, UK</li>
<li class="list-item">1821 - began his training as a doctor</li>
</ul>

Answer 2

If you want to keep the list centered in the page/parent element, but have the list items aligned to the left, wrap the ul tag in a block container that has a text-align: center;, and set the ul as a display: inline-block; and text-align: left;.

Answer 3

Did you want this? https://codepen.io/anon/pen/WdyVPJ
Code
HTML
<ul class="list">
<li class="list-item">1794 - born in Berkeley, UK</li>
<li class="list-item">1821 - began his training as a doctor</li>
</ul>
CSS
ul {
text-align: left;
}
li {
text-align: center;
}

Answer 4

That's because you have to center the internal elements (<li>) while aligning to the left the external element (<ul>)
<ul style="text-align:left">
<li style="text-align:center"> 1794 - born in Berkeley, UK </li>
<li style="text-align:center"> 1821 - began his training as a doctor </li>
</ul>
Check the result here: https://jsfiddle.net/L1xmkof6/