html - 小さなボタンを作成する

Question

11px x 11px のボタンを作成しようとしていますが、試したすべてのブラウザのボタンの最小幅は 12px のようです (16px の IE9 を除く)。これを回避する方法はありますか、それともアンカー タグを使用する必要がありますか?

私のCSS

#testButton
{
    background-image: url(images/Sprites.png);
    width: 11px;
    height: 11px;
    border: 0 none transparent;
}

IE での結果

Answer 1

すべてのブラウザにはデフォルトの CSS があります。CSSリセットを使ってみてください

ボタンのCSSにpaddingandmarginを追加してみ てください0

#testButton
{
    background-image: url(images/Sprites.png);
    width: 11px;
    height: 11px;
    border: 0 none transparent;
    padding:0;
    margin:0;
}

Answer 2

わかりました、とても興味深い質問です。私はここで遊んでいます。ここでは Mac で Safari を実行しています。

<button></button>私にとって、これは単純な要素で機能します（私はそう思います） ：

button {
  width: 2px;
  height: 2px;
  padding: 0px;
  box-sizing: border-box;
  border: 0;
  background: red;
}

box-sizing注意すべき重要なことはパラメータだと思います。詳細については、こちらをご覧ください。paddingもちろんスタイルも一緒です。