CODEWITHSUNDEEP
htmlcss
Jesper Petersen
Jesper Petersen

Reputation: 45

Align text to the icon

Please assist me aligning the icon and text vertically

enter image description here

HTML

<div id="opretForum">
   <ul>
      <li><a href="/opret-forum/">Opret Forum</a></li>
   </ul>
</div>

CSS

#opretForum li {
    list-style-image: url('/img/forum/tilfoj.png');
}

#opretForum ul {
    list-style-position: inside;
}

Upvotes: 3

Views: 100

Answers (2)

Frankey
Frankey

Reputation: 3755

As far as I know it ain't possible to align the list-style-image. The method that is often used is as follow:

http://jsfiddle.net/fcPNp/

li {
  background: url('/img/forum/tilfoj.png') no-repeat left center;
  padding: 3px 0px 3px 20px;
  list-style: none;
}

Upvotes: 2

Rafael Herscovici
Rafael Herscovici

Reputation: 17134

something like this should work:

<style>
#opretForum li { list-style:none; background:url('/img/forum/tilfoj.png');vertical-align:middle }
</style>

<div id="opretForum">
     <ul>
         <li><a href="/opret-forum/">Opret Forum</a></li>
     </ul>
</div>

Upvotes: 0

Related Questions