Why do lists display with larger left margin in View Item than in Design View?

After six hours of experimentation and thorough reading of the RH forums, I cannot get a simple list to display the same in both Design View and View Item.  If someone can help me, I would be most grateful.  I have over 400 pages -- most with lists -- to do in RoboHelp 2015 on Windows 10 on a 1080p monitor at 96dpi.  I have tried multiple combinations of margin-left, margin-right, padding-left, text-indent and list-style-position attributes.   I have tried positive values and negative values in many different combinations.  The result: if the Design View is WYSIWYG then the View Item is not ... and vice-versa.  This problem takes away some of the usefulness of using the RoboHelp Editor for me.  Now, I am faced with having to use two CSS style sheets -- one .css for CHM output (with smaller margin-left's) and another different .css (with larger margin-left's) just to see what the pages will look like.  Help?

     -- Frustrated in Seattle

DISPLAY IN DESIGN VIEW (with ol # and period centering on ul bullet):

DISPLAY IN VIEW ITEM (100% for Desktop) (larger left margin !!!)

THE CSS (set for rendering in the Design View):
----------------------------------------------------------------
p {
font-family: Calibri, sans-serif;
font-size: 12.0pt;
font-weight: normal;
margin: 0in 0.05in 0in 0.05in;
}
ul {
font-family: Calibri, sans-serif;
font-size: 12pt;
font-weight: normal;
margin-top:    0in;
margin-bottom: 0in; 
margin-right: .05in;
margin-left:  .45in;
text-indent:  .01in;
list-style-position: outside;
}
ol {
font-family: Calibri, sans-serif;
font-size: 12pt;
font-weight: normal;
margin-top:    0in;
margin-bottom: 0in;
margin-right: .05in;
margin-left:  .48in;
text-indent: -.01in;
list-style-position: outside;
}
li {
font-family: Calibri, sans-serif;
font-size: 12pt;
font-weight: normal;
}

THE HTML:
--------------
<p>The HTML:</p>
<p>&#160;</p>
<ul>
<li><b>First Category: </b>Butcher</li>
<li><b>Second Category: </b>Baker</li>
<li><b>Third Category: </b>Candlestick Maker</li>
</ul>

<ol>
<li>Butcher</li>
<li>Baker</li>
<li>Candlestick Maker</li>
</ol>
<p>&#160;</p>