Creating Menu Indicators
I want to add indicator icons to my menu when a user has new messages etc... what is the best technique to do this in CSS insofar as positioning is concerned? What's the markup look like in HTML/CSS?
Right now it is a simple inline ul > li menu
Here's a screenshot of what I want to create, I did this in PhotoShop, the blue bubble icons with a number in it, which is dynamic of course:
<li><a href="...">Messages</a><span id="nbmsges">15"</span></li>
/* width and height will be the same as background image */
background:url(images/speechicon.png) no-repeat 0 0;
padding:2px 0 0 5px; /* set to position number */
Make sure the top level ul > li items have enough height and width to accommodate both the hyperlink <a ..>...</a> and the <span ...>..</span> elements.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)