CSS centered list bullet and numbering - html

Question

I have an issue with a website I'm making. There are 2 lists inside of boxes all the text seems to be centered with the bullets out on the far left side of the text. I checked this on my local host and no issues were found there. But when I upload it to my web server the issue happens. I would like the text centered but the bullets closer to the text. Attached is the CSS and HTML for the boxes. Also a link to the file with the issue link (It's live but not linked publicly yet)
.centerDivR {
width: 80%;
height: 500px;
margin: 0 auto;
}
.rulesspace {
width: 4%;
height: 300px;
float: left;
}
.news2 {
width: 46%;
height: 300px;
background-color: rgba(192, 192, 192, 0.6);
float: left;
padding: 4px;
}
.rulesa {
width: 46%;
height: auto;
float: left;
padding: 4px;
}
.rulesb {
width: 46%;
height: auto;
float: left;
padding: 4px;
}
<div style="text-align: center; font size:12pt;"><span class="body">Server Rules||Route Specific Rules
||Local Information
||Train & Destination Tags<br></div></span>
<hr>
<div class="centerDivR">
<div class="rulesa">
<div style="text-align: center;">
<span class="h2"><i>General Rules:</i></span>
<br>
<br>
</div>
<ul>
<li>No Advertiseing other servers</li>
<li>Four Strike Policy
<ol>
<li>1st Warning</li>
<li>2nd Warning</li>
<li>2 Week Ban</li>
<li>Perminate Suspension</li>
</ol>
</li>
<li>Please keep foul language to a minimum</li>
<li>Be considerate of other players</li>
<li>Discussion or distribution of pirated or illegally acquired software is strictly prohibited</li>
</ul>
</div>
<div class="rulesspace"></div>
<div class="rulesb">
<div style="text-align: center;">
<span class="h2"><i>Multiplayer Server Rules:</i></span>
<br>
<br>
</div>
<ul>
<li>No spanwing trains with out dispatcher permission</li>
<li>No flipping switches while DS is on duty with out proper permission</li>
<li>No passing red signals without G or P plates</li>
<li>If a signal has stop indication but contains a G or P plate, stop, and ask DS to proceed at restricted speed</li>
<li>Flipping switches & dropping signals without proper permission while a train is approaching is strictly prohibited.</li>
<li>Hump Yard tags/settings are not to to be changed except by an Administrator.</li>
<li>For the UP and BN trackage, call signals LOWER than clear.
<br>(Clear Varients may be called)</li>
<li>Obey all Speed limits</li>
<li>Do not leave mainline switches open</li>
<li>Special trains (circus trains, OCS trains, etc. may be run only with administrator permission)</li>
<li>Running a track intended for traffic moving opposite your direction may be run ONLY with track warrant accompanying.</li>
<li>If you need to leave with other players on the same trackage, you may step away and hold the main for 15 minutes.
<br>If the limit is reached, your train will be saved and deleted for you to resume later.</li>
</ul>
</b>
</div>
</div>

Answer 1

You might have some mis-matched <div> elements or other markup errors, please valid your HTML and fix them.
If you do set the list items to be center aligned (or inherited from the containers). Try this:
li {
list-style-position: inside;
}
jsFiddle
body {
text-align: center;
}
li {
list-style-position: inside;
}
<ul>
<li>No Advertiseing other servers</li>
<li>Four Strike Policy
<ol>
<li>1st Warning</li>
<li>2nd Warning</li>
<li>2 Week Ban</li>
<li>Perminate Suspension</li>
</ol>
</li>
<li>Please keep foul language to a minimum</li>
<li>Be considerate of other players</li>
<li>Discussion or distribution of pirated or illegally acquired software is strictly prohibited</li>
</ul>