title: Extra padding inside a div
body: <p>I m having problem to determine from where extra padding is added to a div.</p>
  
  <p>The div containing the text "Video Title" has too much padding added to it. Which is very much unwanted. And i have no idea from where this extra padding is coming.</p>
  
  <p>I have added the styles, the html codes and the link to a page using this sample page.</p>
  
  <p>Please have a look, I'm about to go insane.</p>
  
  <hr>
  
  <p>The style --</p>
  
  <pre><code>&lt;style type="text/css"&gt;
      html *
      {
          margin: 0;
          padding: 0;
          border: 0;
          outline: 0;
          vertical-align: baseline;
      }
      table.video_list
      {
          width: 100%;
          border-collapse: collapse;
      }
  
      table.video_list td
      {
          padding: 5px;
          width: 33%;
      }
  
      div.vid_container
      {
  
          /*float:left;*/
          /*margin-bottom:15px;
          margin-left:5px;
          margin-right:15px;*/
          position: relative;
          display: inline-block;
          /*width:242px;*/
          margin: 10px;
          /*width: 300px;*/
      }
  
      div.vid_container div.duration
      {
          /*background-color:#160A07;*/
          /*background-color: transparent;
          background-image: url(../images/backs/duration_back_58x24.png);
          background-position: center center;
          background-repeat: no-repeat;*/
  
          -moz-border-radius: 3px;
          -webkit-border-radius: 3px;
  
          background-color: #1b1b1b;
          bottom:27px;
          color:#FFFFFF;
          float:right;
          font-size:14px;
          padding:4px;
          position:relative;
          right:2px;
          text-align:center;
          width:50px;
          filter: alpha(opacity = 85);
          opacity: 0.85;
          font-weight: bold;
  
      }
  
      div.vid_container div.info_holder
      {
          width: 248px;
          margin: auto;
          display: block;
      }
  
      div.vid_container div.thumb_holder
      {
          width: 244px;
          height: 184px;
          vertical-align: middle;
          border: solid 1px #323434;
          padding: 1px;
          margin: auto;
      }
  
      div.vid_container div.thumb_holder img.thumb
      {
          width: 236px;
          height: 176px;
          vertical-align: middle;
          border: solid 1px #323434;
      }
      div.vid_container a.title
      {
          color:#DBA0AC;
          display:block;
          font-size:14px;
          height:35px;
          overflow:hidden;
          text-decoration:none;
          white-space:pre-line;
          width:248px;
          padding-top: 1px;
          padding-bottom: 1px;
      }
  
      div.vid_container a.title:hover
      {
          text-decoration: underline;
      }
  
      div.vid_container div.info_holder div.info_text
      {
          margin-top:5px;
          text-align: left;
          padding-top: 1px;
          padding-bottom: 1px;
      }
  
      div.vid_container div.info_holder div.time
      {
          color: #ccc;margin-top: 5px;font-size: 90%;
          text-align: left
      }
  
  
  
  
      /******************************************
          Videos list
      ******************************************/
  
      .vid_container .site_name
      {
          text-transform: capitalize !important;
      }
  
      .vid_container img.thumb
      {
          width: 242px !important;
          height: 182px !important;
          border:1px solid #323434 !important;
      }
  
      /******************************************
          List View
      ******************************************/
  
      div.vid_container_listview
      {
          width: 100% !important;
      }
  
      div.vid_container_listview div.thumb_holder
      {
          float: left !important;
      }
  
      div.vid_container_listview div.info_holder
      {
          float: left !important;
          margin-left: 10px;
      }
  
      div.vid_container_listview div.info_holder div.title_holder
      {
          min-height:30px;width:600px;
      }
  
      div.vid_container_listview div.info_holder div.info_text
      {
          color: #ccc;margin-top: 5px;
      }
  
      div.vid_container_listview div.info_holder div.info_text div.site_name
      {
          font-size: 100%;margin-top:15px;
      }
  
      div.vid_container_listview div.info_holder div.info_text div.likes_and_views
      {
          font-size: 100%;margin-top:15px;
      }
  
      div.vid_container_listview div.info_holder div.added_at
      {
          color: #ccc;margin-top: 5px;font-size: 100%;
      }
  
      div.vid_container_listview a.title
      {
          font-size: 16px;
          font-weight: bold;
      }
  
      .float_left
      {
          float: left;
      }
  
      .float_right
      {
          float: right;
      }
  
      .clear
      {
          clear: both;
      }
  &lt;/style&gt;
  </code></pre>
  
  <p>And the Html:</p>
  
  <pre><code>&lt;div class="vid_container"&gt;
      &lt;div class="thumb_holder"&gt;
          &lt;a href="#" title="Brunette Teen Paige Taylor"&gt;
              &lt;img alt="Brunette Teen Paige Taylor" class="thumb" src="empty_thumb.png" norotate="1" /&gt;
          &lt;/a&gt;
  
          &lt;div class="duration"&gt;30:16&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="info_holder"&gt;
          &lt;div class="info_text"&gt;
              &lt;a class="title" href="#" title="Brunette Teen Paige Taylor"&gt;Video Title&lt;/a&gt;
          &lt;/div&gt;  
  
          &lt;div class="time"&gt;16 days  ago&lt;/div&gt;                    
  
          &lt;div style="color: #ccc;margin-top: 5px;"&gt;
              &lt;div class="float_left site_name" style="font-size: 90%;"&gt;Youtube&lt;/div&gt;
              &lt;div class="float_right" style="text-align:right;padding-right: 2px;font-size: 90%;"&gt;1 likes — 140 views&lt;/div&gt;
              &lt;div class="clear"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The link to this sample page is: <a href="http://ultrasoftbd.com/stackoverflow/test.html" rel="nofollow noreferrer">Sample Page</a></p>