CSS - <img>タグの幅が画像ファイルの幅より狭くなっています。真ん中に揃えることが可能ですか？

Question

がタイトルとして示唆しているように、ソースの画像タグを中心に置いています。画像の種類がの場合、の幅は212ピクセル、imgタグの幅は210ピクセルです。

右から1pxの柱を紛失する代わりに、左から1、右から1を失う可能性はありますか？

ありがとうございます。

EDIT：私のイメージは、それはそうと、圧縮されたクロップない、さらに悪化している取得します:)

Answer 1

あなたはCSSを経由して境界線を追加することができます。

img { 
    border: 1px solid white; /* or same colour as your site's background */ 
} 

または代わりに含む要素を置くを画像の周り、例えば

<div class="img"><img src .. /></div> 

.img { 
    text-align: center; 
    width: 212px; 
} 

Answer 2

div内にイメージタグをラッピングすることをおすすめします。その後、持っているイメージタグを設定し、その後212pxの幅を持つようにDIVを設定します：

margin: 0 auto; 

この行は0画像の上下に余白や自動パラメータを持つようにイメージを伝えます左と右のマージンは、ブラウザに含まれている要素（この場合はdivラッパー）の中に要素を配置します。

Answer 3

これを行うための最善の方法は、div要素内の画像が含まれていることです：

<div id="image_container"> 
<img id="img" src="/whatever.jpg"/> 
</div> 

CSS：

#image_contrainer{ 
width:212px; 
text-align: center; 
} 

#img{ 
width:auto; 
margin:auto; 
} 

これは正確ではないかもしれないが、その正確なアイデアは、この種を行うには物のそれが動作するまでちょうど周りを再生します。