ヘッダーが許可されていません<span>が同じ行に揃うようにします

Question

私は、同じ行のテキストを整列させることができないCSSヘッダーを持っています。私は、ヘッダーに奇妙なデフォルトがあると思いますが、私はこれをやることができません。どうすればデフォルトを防ぐことができますか？

HTML

h3>Size:</h3> 
<?php echo "<span class='sP'>".$pSize ."</span><br>"?> 

CSS

h3{ 
margin-top: 0; 
margin-bottom: 0; 
color: #7C7C7C; 
font-size: 20px; 
font-weight: bold; 
text-align: left; 
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace; 
} 

.sP{ 
color: #7C7C7C; 
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace; 

} 

Answer 1

私は、これはあなたが探している答えになると思います - ちょうどdisplay:inline-blockを置きます。何か問題があれば質問してください。彼らの隣に何かを表示するためにインラインブロック：あなたは、特に彼らに表示を設定する必要が理由ですので

h3{ 
 
margin-top: 0; 
 
margin-bottom: 0; 
 
color: #7C7C7C; 
 
font-size: 20px; 
 
font-weight: bold; 
 
text-align: left; 
 
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace; 
 
display:inline-block; 
 
} 
 

 
.sP{ 
 
color: #7C7C7C; 
 
font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace; 
 
display:inline-block; 
 

 
}

<h3>Size:</h3> 
 
<span class='sP'>hi</span><br>

Answer 2

ヘッダーは全幅を取るよう<h3>タグで<span>を置くようにしてください。

<h3>Size: 
    <?php echo "<span class='sP'>".$pSize ."</span><br>"?> 
</h3> 

Answer 3

見出し要素（H1-H6）は、ブロックレベル要素です。

h1 { display: inline-block } 
 
span { display: inline-block }

<h1>Hello, i'm a big fat heading</h1> 
 
<span>Look at me, i'm a little 'ol span</span>