17

CSSを使用して、

Firefox でタグの高さを指定しようとしていますが、span受け入れられません (IE は受け入れます)。

Firefox は、heighta を使用すると を受け入れますdivが、a を使用する際の問題divは、この特定のインスタンスでは使用できない、その後の煩わしい改行です。

次のCSSスタイル属性を設定してみました：

表示: インライン
の場合div、Firefoxはとにかくそれを動作に戻し、属性をもう一度span無視するようです。height

4

9 に答える 9

32

任意の要素をdisplay: inline-blockに設定して、高さまたは幅を受け取ることができるようにすることができます。これにより、他の「ブロック スタイル」を要素に適用することもできます。

ただし、注意すべき点の 1 つは、Firefox 2 がこのプロパティをサポートしていないことです。Firefox 3 は、このプロパティをサポートする最初の Mozilla ベースのブラウザーです。Internet Explorer を含む他のすべてのブラウザは、このプロパティをサポートしています。

inline-block互換モードで実行している場合、Firefox の要素内でテキストの配置を設定できないことに注意してください。私の知る限り、他のすべてのブラウザはこれを許可しています。quirks モードで実行中に text-alignment を設定したい場合は、 の-moz-inline-stack代わりにプロパティを使用する必要がありますinline-block。これは Mozilla のみのプロパティであるため、Mozilla のみがこれを取得し、他のブラウザは標準のinline-block.

于 2008-08-24T15:19:57.007 に答える
17

インライン要素は、そのような高さ (幅も) を持つことはできません。SPAN はデフォルトですでにdisplay: inline設定されています。この場合、実際には Internet Explorer が壊れたブラウザです。

于 2008-08-24T13:42:46.180 に答える
17 
<style>
#div1 { float:left; height:20px; width:20px; }
#div2 { float:left; height:30px; width:30px }
</style>

<div id="div1">FirstDiv</div>
<div id="div2">SecondDiv</div>

1 と 2を保持するコンテナのdiv's幅が十分に広い限り、これで問題ありません。

于 2008-08-24T13:47:05.343 に答える
2

インラインで表示しているため、高さは line-height 属性の高さに設定する必要があります。

レイアウト方法に応じて、いつでもスパン/div で float:left または float:right を使用して、改行を防ぐことができます。しかし、文の途中に入れたい場合は、そのオプションはありません。

于 2008-08-24T13:41:59.753 に答える
1

スパンの高さを設定するには、Firefoxでフォローする必要があります

span {
  display: block;
  height: 50px;
}
于 2009-05-26T08:26:52.290 に答える
1

に設定されている場合、スパン要素の高さ (および幅) のみを変更できますdisplay: block;。これは、通常インライン要素であるためです。通常divに設定されています。display: block;

解決策は、次を使用することです。

<div style="background: #f00;">
    Text <span style="padding: 14px 0 14px 0; background: #ff0;">wooo</span> text.
</div>
于 2008-08-24T13:44:11.557 に答える
1

問題は、'display: inline' が関連付けられた高さを取得できないことです。これは、インラインであるため、コンテンツから高さを取得するためです。とにかく、行末で壊れているボックスの高さをどのように定義しますか?

代わりに 'line-height' を設定してみてください。満足のいく結果が得られない場合は、パディングを設定してください。

/* makes the whole box higher by inserting a space between the border and the content */
padding: 0.5em 0;
于 2008-08-24T13:44:33.680 に答える
0

padding および block-inline 属性を使用して調整できる要素内のテキストの配置。表示:インラインブロック; パディングトップ:3px; 例えば

于 2009-04-08T19:19:16.143 に答える