0

私のHTML構造は次のとおりです。

<div id="id1">
   <h1>my name </h1><h3><a href="mailto:myemail_id">myemailid@xyz.com</a></h3>
</div>

コードは自動的<h3>に次の行に移動します。<h1>ただし、行を変更せずに隣に配置したいと思います。

CSS：

#id1{
    width: 900px;
    padding: 30px; 
    background: #FFF;
    text-align:center;
}

#id1 h3{
    font-family:Arial;
    white-space:nowrap
}

希望する結果を達成するためにどのように変更できますか？

4

2 に答える 2

3

よりセマンティックなマークアップを使用するか、CSSで要素を変更するだけです。

#id1 h1, #id1 h3 { display: inline; }
于 2013-01-12T02:09:10.443 に答える
2

display: blockデフォルトでのHTML見出しの動作。したがって、他のrelative要素と同じ行を共有することはありません。

表示をinline-blockに設定すると、期待どおりに次々にレンダリングされます。

于 2013-01-12T02:12:38.943 に答える