Search code examples
csshtml-listspositioningtext-align

CSS: How to move text link to the right inside li


I want to move slightly to the right a text link that is aligned to the left inside a li.

Which is something similar to left:2px; but only applied to the text.

Page link: http://npmaudiovisual.com/esde/?page_id=36

enter image description here

CSS:

#secondnav li a {
    border: medium none;
    display: block;
    padding: 3px 8px;
}
#secondnav li a {
    display: block !important;
    line-height: 42px !important;
    padding-left: 15px;
    text-align: left;
    text-decoration: none;
    width: 230px;
}
#secondnav li a {
    background-color: #FFC477;
    border: 1px solid white !important;
    color: #FFFFFF;
    font-size: 18px !important;
    position: relative;
    right: 30px;
    z-index: 1;

Solution

  • You can use text-indent alone or padding-left and reduce width by the same amount.