100% genişlik Tablo & Div aynı büyüklükte değil

Question

Bir kapta bir Div ve bir Masa var. İkisinin de kabı tamamen doldurması gerekiyor ama bazen çok sinir bozucu bir piksel farkı var. Bir test vakası oluşturdum ve hatanın açıkça görülebileceği bir ekran görüntüsü ekledim (sağ tarafta). Bunu düzeltmek için zaten var mı?

* { 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 
.container { 
 
    width: 80%; 
 
    margin: 0 auto; 
 
} 
 
.head { 
 
    width: 100%; 
 
    background: teal; 
 
} 
 
table { 
 
    width: 100%; 
 
    background: teal; 
 
}

<div class="container"> 
 
    <div class="head"> 
 
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. 
 
     Mauris placerat eleifend leo.</p> 
 
    </div> 
 
    <table> 
 
    <tr> 
 
     <td>1</td> 
 
     <td>2</td> 
 
     <td>3</td> 
 
     <td>4</td> 
 
    </tr> 
 

 
    <tr> 
 
     <td>1</td> 
 
     <td>2</td> 
 
     <td>3</td> 
 
     <td>4</td> 
 
    </tr> 
 

 
    <tr> 
 
     <td>1</td> 
 
     <td>2</td> 
 
     <td>3</td> 
 
     <td>4</td> 
 
    </tr> 
 
    </table> 
 
</div>

Answer 1

tablo genişliği: div sadece olursa olsun tam boyutunu alırken% 100 450.5 piksel gibi bir şey eşit olduğunda% 100 yuvarlanır bir genişliğe neler yuvarlama olmadan sadece koyarak: ekran: div üzerindeki tablo sorunu giderdi.