title: Proper text align with absolute position
body: <p>very simple thing, but I've got lost in this ..</p>
  
  <p>I have square where inside of it is heading and paragraph. What I need is simple align paragraph right under heading, but from some misterious reason there is still some space which blocks me from proper aligning. I'm using absolute positioning as you can see in code below.</p>
  
  <p>Thank you soo much to get me off this! :)</p>
  
  <p>SCSS </p>
  
  <pre><code>.wrapper-logo {
      position: absolute;
      border: 2px solid #fff;
      width: 230px;
      height: 230px;
      top: 24%;
      left: 60%;
  
      .header-logo {
          background-image:url(../img/header.png);
          background-repeat: no-repeat;
          background-position: center;
          background-size: cover;
          width: 210px;
          height: 210px;
          margin: 8px;
          border: 0;
  
          h1 {
              margin: 0!important;
              padding: 80px 0 0;
              vertical-align: middle;
              text-align: center;
              text-transform: uppercase;
              font-size: 220%;
              letter-spacing: 3px;
              color: $dark;
              font-weight: 500;
          }
  
          p {
              margin: 0!important;
              text-align: center;
              text-transform: uppercase;
              letter-spacing: 3px;
              word-spacing: 2px;
              color: $grey;
              line-height: 0px;
          }
      }
  }  
  </code></pre>
  
  <p>HTML </p>
  
  <pre><code>&lt;div class="wrapper-logo"&gt;
      &lt;div class="header-logo"&gt;
          &lt;h1&gt;My heading&lt;/h1&gt;&lt;br&gt;
          &lt;p&gt;My paragraph&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>