gpbaculio
gpbaculio

Reputation: 5968

how to style on the most right in <li>s?

cant figure out why this code dont work, it's still on left:

<ul style="list-style: none; width: 200px;" >
<li class="item" ><p>hello world</p></li>
<li class="item"><p>hello world</p></li>
<li class="item"><p>hello world</p></li>
</ul>

my css:

.item {
 position: relative; 
 right: 0px; 
 margin-top: 2px;
}

I tried transferring the style of li on p and both but it still has no effect. Help?

Upvotes: 0

Views: 42

Answers (2)

ankita patel
ankita patel

Reputation: 4251

add text-align:right in .item property

.item {
 position: relative; 
 margin-top: 2px;
 text-align:right;
}
<ul style="list-style: none; width: 200px;" >
<li class="item" ><p>hello world</p></li>
<li class="item"><p>hello world</p></li>
<li class="item"><p>hello world</p></li>
</ul>

Upvotes: 0

BenM
BenM

Reputation: 53228

Just use text-align: right on your <ul>:

<ul style="list-style: none; width: 200px; text-align:right" >
  <li class="item" ><p>hello world</p></li>
  <li class="item"><p>hello world</p></li>
  <li class="item"><p>hello world</p></li>
</ul>

Upvotes: 1

Related Questions