html – 内嵌块和文本包装与CSS

我想显示一个复选框,后面是一些文本,它自带的下面.没有任何CSS的 HTML如下所示：

<input type="checkBox" checked="checked" />
<div>Long text description here</div>

我想要显示类似于：

X   Long Text
    Description
    Here

它目前围绕着这样

X   Long Text
Description Here

这对表很容易,但是由于其他原因我需要它在CSS中.我认为显示的组合：inline-block / float：right / clear / spans而不是DIV可以工作,但我迄今没有运气.

解决方法

将复选框和标签包装在容器div(或者,我经常与列表形式)并应用

<div class="checkBox">
  <input type="checkBox" id="agree" />
  <label for="agree">I agree with checkBox</label>
</div>




.checkBox input {
      float:left; 
      display:block;
      margin:3px 3px 0 0;
      padding:0;
      width:13px;
      height:13px;
     }

.checkBox label {
      float:left;
      display:block;
      width:auto;
     }