Centering listed right-aligned paragraphs

Question

For starters there are many reasons that I can't change the html code so any solution must be using the current html code. What I am trying to do is to right-align the paragraphs but have them centered and not be on the right side of my screen because it doesn't look nice.

<ul class="ullist">
<li><p>sometext</p></li>
<li><p>somemoretext</p></li>
<li><p>somemoremoretext</p></li>
<li><p>lesstext</p></li>
<li><p>text</p></li>
</ul>

CSS:

 ul.ullist li {
    display: block !important;
    width: 100% !important;
    margin-bottom: 0;
    text-align: right;
}

ul.ullist li p {
font-size:2.4em;
color:#000;
font-weight:600;
white-space:nowrap;
display:inline-block;}

Answer 1

You can add margin-right to your paragraphs:

 ul.ullist li { display: block !important; width: 100% !important; margin-bottom: 0; text-align: right; } ul.ullist li p { font-size:2.4em; color:#000; font-weight:600; white-space:nowrap; display:inline-block; margin-right: 10%; } 

 <ul class="ullist"> <li><p>sometext</p></li> <li><p>somemoretext</p></li> <li><p>somemoremoretext</p></li> <li><p>lesstext</p></li> <li><p>text</p></li> </ul> 

Answer 2

Try setting some width on ul.ullist and set margin:auto on it.

 ul.ullist{ min-width:200px; width:300px; /*Change the width to suit your needs*/ margin:auto; } ul.ullist li { display: block !important; width: 100% !important; margin-bottom: 0; text-align: right; } ul.ullist li p { font-size:2.4em; color:#000; font-weight:600; white-space:nowrap; display:inline-block;} 

 <ul class="ullist"> <li><p>sometext</p></li> <li><p>somemoretext</p></li> <li><p>somemoremoretext</p></li> <li><p>lesstext</p></li> <li><p>text</p></li> </ul>