Question

I am trying to align a span to the right of an a element without pushing it onto another line and without manually setting the width of the containing div.

I have tried all sorts of combinations of white-space,position,float,text-align etc, but I simply cannot get this to work.

Here is an example of the issue:

http://jsfiddle.net/QgzbY/2/

Notice the ‘Ctrl+Shift+S’ is on the line below ‘Save Document As’, I want this to be on the same line, aligned to the right like the line above. In other words, it needs to increase the width on the containing element in order to fit the shortcut text.

Question in short: How can I float an element to the right of a parent element, whilst always keeping the contents on one line?

If this cannot be achieved using CSS, then please don’t waste your time helping me with the Javascript as there are many more people on the Stack that need help and I can write this part myself. I was just hoping it wouldn’t be necessary 🙂

Answer 1

Thank you for all of your answers. Unfortunately, it seems that what I was trying to achieve is not possible without manipulating the widths of the menus. I thought this might be the case 🙁

Thanks anyway for all your tips