使用单选按钮在面板中对齐

时间:2015-08-27 19:27:32

标签: javascript html css

我使用它来显示多个产品并使其正常工作,除了我试图让我的副标题与其上方的产品标题对齐。

我希望第一行的标题和第二行的子标题,但不希望子标题包含在单选按钮下。

还想垂直居中面板标题行的单选按钮。

ion-content

https://jsfiddle.net/blaine109/um7m89hp/

2 个答案:

答案 0 :(得分:1)

我建议您使用绝对位置link。如果您只支持现代浏览器,则可以使用

transform: translateY(-50%)

而不是

margin-top: -6px; // half of the height of the radio button

答案 1 :(得分:0)

取出<br />并将文字内联。

<h4 class="panel-title">
  <div>
    <input type="radio" name="specs">
    <span> Some Product Title #1 </span>
    <span>Some Product Subtitle</span>
  </div>
</h4>