Link to home
Start Free TrialLog in
Avatar of Pete C
Pete CFlag for United States of America

asked on

Position content within links

Hi - I want to append a number after menuitems, e.g.
Inbox (5)
Drafts (2)

but rather than use the above format, I want to use gmail's approach whereby they right align the numbers.  I assume that gmail uses links for the menuitems; in which case, perhaps they place the number within a div (within the link) and then position it to the right.

That may be fine, but I am not sure if you are supposed to insert a div within a link.  Any thoughts as to the best approach?


ASKER CERTIFIED SOLUTION
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Pete C

ASKER

thanks, my question was not very clear, I am interested in aligning content within a link.  I assume that I need to place the content that I want to align within a div and then position it to the right; or alternatively, you seem to suggest that I could place it within a span and then float it right (within the link).
Like I said, you need to provide more details and some sample code you are working with, otherwise we are just guessing. Just add a link and it will work the same.

<div class="item">
     
  <a href="#">  item <span class="subitem">(3)</a></span>
 
 </div>

Open in new window


More than likely you are working with an unordered list for your navigation and not div's like this.  You can apply the same thing I just showed you.

Your next step is to work with the code you have, apply what I have showed you, if it is not working, try and fix it. If you need our help, provide a link to your test site for us to look at or recreate a test case like I did on codepen or jsfiddle.   We will need code to get you going.
Avatar of Pete C

ASKER

Thanks, I was just interested in the bigger picture.  Using spans worked great