CSS 被覆盖：为什么搜索框不能正确浮动？答案

【问题标题】：CSS Overridden: Why Doesn't Search Box Float right?CSS 被覆盖：为什么搜索框不能正确浮动？
【发布时间】：2012-08-11 02:16:16
【问题描述】：

我完全不知道为什么我不能将搜索框对齐到左侧

搜索和 RSS 提要在测试页面上对齐：

http://scottjaxon.com/devsite/testnivo48.html

就像在主页上一样（使用图片而不是 nivo 滑块） http://scottjaxon.com/devsite/index.html

我不明白。我一定会漏掉最小的东西！

#wrapper #user1 #feahome #searchhome {
float: right;
color: #FFFFFF;
height: 22px;
margin-top: 8px;
padding: 0px 20px 0px 20px;

还是与 NivoSlider CSS 相关？

.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
}
.nivo-main-image {
display: block !important;
position: relative !important; 
width: 100% !important;
}

【问题讨论】：

标签： html css slider nivo-slider

【解决方案1】：

你的 index.html 和 testnivo48.html 有不同的 dom 结构。

在 index.html 中，feahome div 标签是 rsshome 和 searchhome div 标签的父标签；但在 testnivo48.html 中，它们都处于同一级别。

这就是为什么以下 css 规则（在 http://scottjaxon.com/devsite/css/style.css 中）被应用于 index.html，但在 testnivo48.html 中被忽略

#wrapper #user1 #feahome #searchhome {
    ...
}

修复 html 后，您的问题可能会得到解决。

【讨论】：

【解决方案2】：

我正在查看两者的 CSS，我看到的唯一的东西在你的 CSS 与 http://scottjaxon.com/devsite/index.html 的 CSS 相比是这样的：

#wrapper #user1 #feahome #searchhome {
float: LEFT; // the working version has it floated left as well
color: #FFFFFF;
height: 22px;
margin-top: 8px;
padding: 0px 20px 0px 20px;

试一试，看看是否可行。

【讨论】：

【解决方案3】：

这可能是一个优先级问题。使用div#searchhome 将赋予它更高的优先级。

【讨论】：