title: Setting margin for label next to checkbox
body: <p>I want to set a margin for text, next to my checkbox. In my HTML it looks like it's one line, but on my site, because of font, it takes two (and that's very ok with me). </p>
  
  <p>No matter what I do: if I do it with padding, margin, or border, every time, only the first row of my text goes a little bit to right, but the second line is stying exactly next to my checkbox. Could you help me? </p>
  
  <p><a href="https://jsfiddle.net/afj206cr/" rel="nofollow">jsFiddle</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.contact input {
    width: 50px;
    height: 50px;
    background-color: #ffffff;
    outline: 1px solid #24ba9f;
    float: left;
  }
  .contact label {
    font-size: 18px;
    text-align: left;
    color: #b2b2b2;
    text-align: left;
    line-height: normal;
    padding-left: 10px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="contact"&gt;
    &lt;label&gt;
      &lt;input type="checkbox" checked&gt;Lorem ipsum, lorem ipsum, lorem ipsum
    &lt;/label&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>