Avatar of shafer23
shafer23
Flag 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?


PHPWeb DevelopmentCSS

Avatar of undefined
Last Comment
shafer23

8/22/2022 - Mon
ASKER CERTIFIED SOLUTION
Scott Fell

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
shafer23

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).
Scott Fell

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.
shafer23

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

I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck