0

このプロパティは、適用先の要素の子にも影響を与える必要がありますか?

これが私の例です

span{
 vertical-align:top;
 font-size:27px;
 border-bottom: 1px solid red;
}
a{
  border-bottom: 1px solid green;
}

<span>
  <a>Hi ho hoh ho</a>
  Hi ho hoh ho
  <a>Hi ho hoh ho</a>
</span>

Firefox ではプロパティは子に影響しませんが、Chrome では子の位置がずれています。

クロム:クロム

ファイアフォックス :ファイアフォックス

良い実装は何ですか?

4

2 に答える 2

0

このフィドルをチェックしてください:

http://jsfiddle.net/5XMk8/7/

すべてのテキストを「a」タグに追加して与えfloat:leftて作成しますdisplay:block

于 2012-09-17T11:11:24.677 に答える
0

仕様上、vertical-alignは継承されませんが、内部要素のベースライン レベルに影響を与える可能性があります。ただし、ブラウザーには、このプロパティの風変わりでさまざまな実装の長い歴史があります。

正確なコードでテストすると、Firefox と同じように Chrome (22beta) が表示されるため、古いバージョンで奇妙なことに遭遇した可能性があります。

ブラウザ間の顕著な違いを確認するには、さまざまなフォント サイズを使用してください。結果の解釈が難しくなります。とにかく、モラルはvertical-align、ほとんどの場合で遊ぶことを避けるべきだということです. 相対位置を使用すると、より一貫した結果が得られる傾向があります。

于 2012-09-17T14:39:55.290 に答える