Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Add an icon to an discussion

edited May 2006 in Vanilla 1.0 Help
I'm trying to add an icon to an sticky discussion, but it doesn't work:

.Sticky { background-image:url(../gfx/icon.png) ! important; background-repeat:no-repeat; background-position:left center; }

What's wrong?


  • Options
    edited May 2006
    Well it sort of works. The trouble is that the contents of the li that the stick applies to also have their own backgrounds. So your image gets covered up by those other background images. If all you want is an icon, then you can probably add padding so that the portion of the background where the icon should be is uncovered. .Sticky { background: url(../gfx/icon.png) no-repeat left center !important; padding-left: 20px !important; }
  • Options
    I tend to use text-indent for that.
  • Options
    the icon is displayed but everything is moved 20px right and that destroys the complete layout...

    .Sticky { background: url(../gfx/icon.png) no-repeat left center !important; text-indent: 20px !important; }
    only the words [Sticky] and the discussion title are moved a little and the icon isn't displayed...
  • Options
    Hmm... try replacing "center" in the background definition with "top".
  • Options
    you'll need to adjust the inner li's to compensate for the padding.
This discussion has been closed.