テーブルの1pxの不要なパディングの取得

Question

何らかの理由で、1pxのパディングまたはボーダーがテーブルに追加されています。私はそれを取り除く方法を理解できません。私は画像にdisplay:block;margin:0;padding:0;を追加しようとしましたが、それで解決しません。私はまた、CSSに<table border="0">とborder:none;を試しました。私の人生のために、私はこれを理解できません。

私はtrの両側のエッジで整列するイメージを取得しようとしているため、丸みのあるボーダーを与えるために、CSS3のボーダー半径はTRでは機能しないためです。私はtable, table * {border:1px solid red;}をCSSに追加しましたが、それは間違いなくパディングや余白の問題のようです。

問題は、このイメージである：左右に

は、あなたがイメージとテーブルの端の間のパディングや何かのいくつかの種類があります見ることができます。赤い罫線はこれを見ているだけです。

table a { 
    color: #f7941E; 
    font-family: Arial; 
    font-size: 16px; 
    font-weight: bold; 
    /* css3 */ 
    transition: color .25s; 
    -khtml-transition: color .25s; 
    -moz-transition: color .25s; 
    -o-transition: color .25s; 
    -webkit-transition: color .25s; 
} 

    table a:hover { 
     color: #f8ae57; 
    } 

table { 
    width: 610px; 
} 

    table tr { 
     height: 33px; 
     padding: 0; 
     margin: 0; 
     vertical-align: middle; 
    } 

     table td { 
      border-collapse: collapse; 
     } 

    table tr.head { 
     color: #58585a; 
     font-family: Rockwell, serif; 
     font-size: 18px; 
     font-weight: bold; 
     text-transform: lowercase; 
    } 

    table tr.even { 
     background: #EEE; 
     height: 33px; 
    } 

     table tr td img { 
      padding: 0 15px 0 13px; 
      vertical-align: middle; 
     } 

      table tr td a img { 
       opacity: .6;     
       /* css3 */ 
       transition: opacity .25s; 
       -khtml-transition: opacity .25s; 
       -moz-transition: opacity .25s; 
       -o-transition: opacity .25s; 
       -webkit-transition: opacity .25s; 
      } 

       table tr td a img:hover { 
        opacity: 1; 
       } 

そしてHTML：：

は、ここに私のCSSです

<table border="0"> 
    <tr> 
     <td><img src="images/tr-left.png" style="display:block;margin:0;padding:0;"> 
     <td><img src="images/some-icon.png" /> <a href="#">Some Content</a></td> 
     <td><img src="images/tr-right.png" style="display:block;margin:0;padding:0;"> 
    </td> 
</table> 

Answer 1

試してみてください。<table border="0" cellpadding="0" cellspacing="0">

Answer 2

これは私のために物事を解決するように見えました。

CSS：

table { 
    width: 610px; 
    border-spacing:0; /* Add this here */ 
} 

Answer 3

私の問題は、いくつかの奇妙な行動だった、と私は本の中ですべてのトリックを試してみましたが、そのパディングは頑固でした。最後に、line-height属性がbodyの要素に設定されていて、padding-topの効果が得られていることが分かりました。

line-height: normal;

の、ローカライズされたルールで、これを上書きした後...問題は解決しました。