0

我想创建一个标题，其中一些单词与标题的最左侧div对齐，一些单词与最右侧对齐。我最初通过创建spans (.headerLeft和.headerRight) 并调整我想要对齐的部分的对齐方式来做到这一点。但是，如果我想要一个background-color用于我的 header ，这会产生问题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;
}
4

3 回答 3

3 
#header {
    overflow: hidden;
}

此代码将解决您的问题。heightof将#header自动height从内部最高的元素中获取#header。

另一种方法是手动设置heightfor #header。

你不需要内联样式:)

于 2012-06-01T17:59:51.227 回答
2

您需要为头类设置溢出属性以强制它环绕内部跨度。见http://jsfiddle.net/PsychegoPro/rnDT8/

于 2012-06-01T18:00:23.653 回答
0

您需要清除浮动以使 div 具有实际高度。

这可以通过使用 clearfix 来实现。什么是清除修复？

于 2012-06-01T18:51:43.677 回答