ヘッダーの左端にdiv
いくつかの単語が配置され、右端にいくつかの単語が配置されたヘッダーを作成したいと考えています。私は最初にspan
s (.headerLeft
と.headerRight
) を作成し、整列させたい部分の整列を調整することでこれを行いました。ただし、background-color
ヘッダーが必要な場合、これは問題を引き起こしdiv
ます。インライン CSS スタイルを少し追加するだけのベスト プラクティス ソリューションですか、それとももっと良い方法がありますか?
マイコード(例)
HTML
<div class="header">
<span class="headerLeft">Welcome to .</span>
<span class="headerRight"><a href="login.html">Login</a> | <a
href ="register.html">Register</a></span>
</div>
CSS
.header {
width:100%
position:fixed;
top:0;
margin-top:0;
background-color:red;
text-color:#C14000;
}
.headerLeft {
float:left;
text-align:left;
}
.headerRight {
float:right;
text-align:right;
}