For my project I need a drop down box which will have 3 columns of text inside (to display; not actually). The problem is they are all numbers and need to be aligned right. I tried everything from calculating space to using CSS (white-space: pre), the <pre> tag or label but nothing works. While looking at the code it shows correct number of space being added to align but still it doesn't show up aligned in the drop down box.

Thanks gesf! But all three parts of data (quantity, cost & price) needs to go together to create one option. That's where I need to align them so when down arrow is clicked all the options show up aligned related to each other. Next database record will create option 2.

So as you can see from the html source, the alignment is being made by a bunch of "spaces".
That's not clean at all, but seems the only way for your case.
So align all the text at right via some style (above) and this same result text (those three together) will already have some "spaces" inside to separate them.
Yep... that's the only way!

When I used the "_" instead of spaces it aligned all the text parts very nicely but now the problem is a little tricky. I tried to specify color as white so the underscores (_) aren't visible but that doesn't work. Do you know how to specify different styles at different parts of texts in one single option? If I apply style to option itslef it works fine but then all the texts take same style and then not visible. How do we specify white for underscores and black or red for the real text? Please help once again!