ブロック要素内にテキストを配置する最適な方法を知りたい。背景ブロック要素として表示されるリンク内のテキストの位置
display: block;
width: 100px;
height: 100px;
background: #000000;
テキストと
<a href="#">foo</a>
通常のリンクが、表示ブロックとしてスタイルは今左上です。 今質問：どのような例をこのテキストを得るための最善の方法：左下または右下ですか？
私は、Aタグの中に新しい要素がないCSSソリューションを好む。いくつかの意見？
コンテンツを選択して下部に配置することはできません。パディング（パディングトップ）を使用することで、istが手を下ろしているように手動で作ることができます。 ので、上記の例では
display: block;
width: 100px;
height: 14px;
background: #000000;
padding-top: 86px
はこれが最善の解決策ですか？私はtheresもテーブル、行の高さとそのようなもののための垂直方向の整列を意味します。 – ggzone
ブロック要素に垂直方向の整列がありません。申し訳ありません... – ptriek
あなたは本当にテーブルを使用したくありません - そして、いいえ - 純粋なcss要素のための垂直方向の整列はありません。 – JorgeLuisBorges
を試してみてくださいまた、ディスプレイの使用を作ることができる：テーブルのセルを - しかし、= IE7
yeah ofc :)しかし、IE7が必要なので、パディングとテキストアライメントを使用します。しかしtx;） – ggzone
<に動作しないことをあなたはこれを試すことができますあまりにも。あなたは18pxのフォントを使用している場合
display: block;
width: 100px;
height: 100px;
background: #000000;
line-height:188px;
font-size:12px;
color:#fff;
text-decoration:none;
あなたは200pxの:)から値よりも減らすよりも、あなたのフォントサイズを変更する場合は、行の高さが182pxので、合計がないが200pxのだろうとされるよりもいいます。
これは、何らかの理由でボックスのテキストが2行になる場合にのみ問題です。 – JorgeLuisBorges
うーん..！パディングが解決策です。それはあなたが正確な価値を得ることはできませんし、あなたの身長を設定するために試行錯誤が必要です。それでも複数の行で問題が生じるかもしれません。 私が信じているように、複数の行があなたにとって最善の解決策ではない場合、** ptriek **があなたに与えたものです。 アンカーの中に** ptriek **の指定された解決法を使用しない限り、複数の行に設定するのは非常に難しいタグを追加したくありません。 –
ラインハイトとパディングの組み合わせは試行錯誤がないことを意味します。 line-heght：20px paddong-top：1行のテキストでは180px = 200px、2つでは220pxなど – JorgeLuisBorges
リンクの周りに別のラッパー要素を設定することはできませんか、そうではないでしょうか？別の要素を追加することで、これを簡単にすることができます。 – SpaceBeers