Question

我完全不知道为什么我无法将搜索框对齐到左边

搜索和RSS源在测试页上对齐：

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

因为它在主页上（带有pic而不是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;
}

Answer 1

我正在查看两者的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;

试一试，看看是否有效。

Answer 2

您的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后，您的问题可能会得到解决。

Answer 3

这可能是优先排序问题。使用div#searchhome会为其提供更高的优先级。

CSS重写：为什么搜索框没有浮动？

3 个答案: