Layout Lounge

I don't know how to remove the default Ljs icons from on top of the custom icons how do I do that?

This is my tiny icon section, the ones I can see work its just that the Ljs icons are on top of them.

/*------------ tiny icons ------------*/ img[src*="icon_protected.gif"], img[src*="icon_private.gif"], img[src*="icon_groups.gif"], .ljuser img[src*="syndicated.gif"], .ljuser img[src*="newsinfo.gif"], .ljuser img[src*="partnercomm.gif"], .ljuser img[src*="sponcomm.gif"], img[src*="userinfo.gif"], img[src*="talk/none.gif"], img[src*="help.gif"] {height: 0px; width: 0px;background: transparent none no-repeat scroll 0 0; } .subject img {vertical-align: middle !important;} img[src*="icon_protected.gif"]{ background-image:url(http://img20.imageshack.us/img20/1182/183o.png); padding:0 0 11px 12px !important;} img[src*="icon_private.gif"]{ background-image:url(http://img20.imageshack.us/img20/1182/183o.png); padding:0 0 11px 12px !important;} img[src*="icon_groups.gif"]{ background-image:url(http://img20.imageshack.us/img20/1182/183o.png); padding:0 0 11px 12px !important; } .ljuser img { width: 0; height: 0; background: transparent url(http://i30.tinypic.com/j13wvm.jpg) no-repeat 0 0; padding: 17px 16px 0 0px !important; vertical-align: baseline !important;} .ljuser img[src*="userinfo.gif"] { background: transparent url(http://i30.tinypic.com/j13wvm.jpg) no-repeat center left !important; padding: 17px 16px 0 0px !important; } .ljuser img[src*="community.gif"] { background:transparent url(http://i30.tinypic.com/jg14ky.jpg) no-repeat scroll 0 0 !important; padding: 16px 16px 0 0 !important; } img[src="http://l-stat.livejournal.com/img/btn_track.gif"] { background:transparent url(http://img190.imageshack.us/img190/4688/041.png) repeat scroll 0 0; height: 0; padding: 0 0 16px 16px !important; width:0; } img[src="http://l-stat.livejournal.com/img/btn_freeze.gif"] { background:transparent url(http://img35.imageshack.us/img35/1876/091s.png) repeat scroll 0 0; height: 0; padding: 0 0 16px 16px !important; width:0; } img[src="http://l-stat.livejournal.com/img/btn_del.gif"] { background:transparent url(http://img25.imageshack.us/img25/1674/101hec.png) repeat scroll 0 0; height: 0; padding: 0 0 16px 16px !important; width:0; } img[src="http://l-stat.livejournal.com/img/btn_scr.gif"] { background:transparent url(http://img37.imageshack.us/img37/2053/150qlp.png) repeat scroll 0 0; height: 0; padding: 0 0 16px 16px !important; width:0; }


EDIT: FINALLY SUCCESS
Between you and Tuff_Ghost (found him in your memories) I found these two replacement codes! It took an hour of replacing codes to get this to work. Although now that I understand your tut a little better I think I'll go with your 16px over the 24px I'm using the icons are a bit spread out. THANKS!!!

.ljuser img[src*="userinfo.gif"] { width: 0 !important; height: 0 !important; background-repeat: no-repeat !important; background-color: transparent !important; background-image: url(MY IMAGE URL) !important; padding: 24px 24px 2px 2px !important; } .ljuser img[src*="userinfo.gif"], .ljuser img[src*="community"] { width: 0 !important; height: 0 !important; background-repeat: no-repeat !important; background-color: transparent !important; background-image: url(MY IMAGE URL) !important; padding: 24px 24px 2px 2px !important;