格式化下拉菜单中<option>标记内的文本

Question

我有这段HT​​ML代码。

<span class="input-box">
                            <label for="intensive">Question</label>
                            <select id="intensive" name="intensive" class="required" required>
                                <option selected="selected" disabled class="placeholder" value=''>Select your option</option>
 <option value="option1">Option 1<span>Price</span></option>
<option value="option2">Option 2<span>Price</span></option>
<option value="option3">Option 3<span>Price</span></option>
</select>

</span>

我很难对齐选项标签中的文本。我想要的是选项标签中的文本在左侧，而跨度即内部的文本。价格合适。 我尝试使用text-align和float:right属性，但是没有运气。

P.S：通过查看那些使我的问题标记为重复的链接，我仍然找不到解决方法。如何使用JS解决此问题？