web-dev-qa-db-ja.com

Aタグの幅と高さを設定する

アンカータグに幅と高さをピクセル単位で設定することはできますか？アンカー内にテキストを保持しながら、背景画像を保持するアンカータグが必要です。

li {
  width: 32px;
  height: 32px;
  background-color: orange;
}

li a {
  width: 32px;
  height: 32px;
  background-color: red;
}
<li><a href="#">Something</a></li>
htmlcsscross-browser
120
Luke

アンカーをdisplay: blockまたはdisplay: inline-block;にする必要があります。その後、幅と高さの値を受け入れます。

266
Jared

display: inline-blockを使用することもできます。これの利点は、ブロック要素のように高さと幅を設定するだけでなく、インラインを設定して、すぐ隣に別のタグを配置して親スペースを許可できることです。

プロパティをここに表示 の詳細を確認できます。

66
sarcastyx

ULリスト内にアンカーを配置しない限り、これらの提案はすべて機能します。

<ul>
    <li>
        <a>click me</a>>
    </li>
</ul>

その後、カスケードスタイルシートのルールはChromeブラウザーでオーバーライドされます。幅は自動になります。次に、アンカー自体でインラインCSSルールを直接使用する必要があります。

7
Bradley

正確な複製ではありません（私が知る限り）が、これは 一般的な問題 です。

display:blockが必要です。しかし、理由を理解するには 仕様を読む を使用する必要があります。

5
zzzzBov

私の下で働く

display: block;
width: 100%;
1
Pankaj Upadhyay