html - 2つのスパン要素間の高さを調整します

Question

div内の2つのスパン要素間の垂直方向のスペースを調整しようとしています。私は私が得ているものの半分を達成しようとしてい<br/>ます。

line-height、vertical-alignまたはmargin-top。それのどれも私のために働きませんでした。これがjsfiddleです

Answer 1

<span>要素はインラインです。<p>のようなブロックレベルの要素をインライン要素の中に入れることはできません。

<div>sの代わりにsを使用する<span>と、CSSは問題なく機能します。

<div class="signupEmailBox">
    <div class="tag"><p>test data goes here</p></div>
    <div class="smallTextEmail">
                    <p>blah blah blah</p>
                    <p>some text goes here...</p>
                    <p>here some more text data</p>
                    <p>some more text</p>
    </div>
</div>
​

Answer 2

とりわけマージンの適用に影響を与えるdisplayという名前のプロパティがあります。このプロパティの値は、デフォルトinlineでスパン要素に対してです。したがって、マージンは適用されません。

divボックスなどの別のデフォルト値を持つ要素を使用するか、スパン要素の表示プロパティの値を変更します。inline-blockspan要素のテキストフロー機能が保持されるため、使用することをお勧めします。

span
{
    display:inline-block;
}