我试图将两条线对齐到单选按钮的中间,如下所示。
使用CSS实现这一目标的最佳方法是什么? 我可以排在最前面,但底线是超级顽固的。 我试图不使用无线电,如果可能的话,因为它正在使用jquery插件进行重新设计。
谢谢你的帮助!
编辑:这是我一直在使用的代码:
<div> <input id="method-{{Description}}" type="radio" name="project[shipping-method]" value="{{Description}}" /> <label for="method-{{Description}}" class="pb-shipping-method-label">{{Description}} ({{DeliveryTime}}) <span>{{Price}}</span></label> </div>I'm trying to have two lines aligned to the middle of a radio button, shown below.
What is the best way to achieve this with CSS? I can line up the top line but the bottom line is super stubborn. I'm trying not to float the radio, if possible, as it is being restyled using a jquery plugin.
Thanks for your help!
EDIT: here's my code that I've been working with:
<div> <input id="method-{{Description}}" type="radio" name="project[shipping-method]" value="{{Description}}" /> <label for="method-{{Description}}" class="pb-shipping-method-label">{{Description}} ({{DeliveryTime}}) <span>{{Price}}</span></label> </div>最满意答案
两个div,一个拿着收音机,一个拿着文字。 将radio div的line-height设置为等于text div的height 。 还要在收音机本身添加vertical-align:middle 。
这是一个演示: http : //jsfiddle.net/AlienWebguy/JffCD/
Two divs, one holding the radio and one holding the text. Set the line-height of the radio div to equal the height of the text div. Also add a vertical-align:middle to the radio itself.
Here's a demo: http://jsfiddle.net/AlienWebguy/JffCD/
更多推荐
发布评论