CSS想不通为什么DIV消失

我试图让一些标签的搜索栏，利用2幅图像，里面2个独立的div，但由于某种原因，它只会显示一个图像。非此即彼。如果我从css注释出home-searchbar-school ID，教授选项卡会显示，否则只有学校会显示，并显示教授选项卡的位置。当我查看谷歌浏览器的开发助手中的div时，显示它们在正确的位置，所以我很难过。CSS想不通为什么DIV消失

这里的HTML：

<div id="home-searchbar"> 
    <div id="home-searchbar-tabs"> 
     <div id="home-searchbar-professor" class="home-searchbar-tab"> 

     </div> 
     <div id="home-searchbar-school" class="home-searchbar-tab"> 

     </div> 
    </div> 
    <div id="home-searchbar-container"> 

    </div> 
</div>

和CSS：

#home-searchbar{ 
    margin-left: 20px; 
    float: left; 
    height: 115px; 
    width: 980px; 
    background-color: green;  
} 

#home-searchbar-tabs{ 
    float: left; 
    width: 980px; 
    height: 32px; 
    background-color: red; 
} 

.home-searchbar-tab{ 
    background-color: yellow; 
    width: 190px; 
    height: 32px; 
    float: left; 
} 

#home-searchbar-professor{ 
    background: url('../img/searchtabs.png') 0 0 no-repeat; 
} 

#home-searchbar-professor{ 
    background: url('../img/searchtabsinactive.png') 0 -64px no-repeat; 
} 

#home-searchbar-container{ 
    float: left; 
    width: 980px; 
    height: 83px; 
    background-color: purple; 
}

的图像是精灵，这些都是正常工作，所以我就只能上传他们中的一个。其他图像是相同的只是不同的配色方案。

另外一个随机的小问题，是在div中有类和id的好风格吗？我仍然在学习CSS，所以想知道这是否是在div中使用这两种方法的最佳方式？

非常感谢您的帮助或建议！

enter image description here

来源

2013-01-03 samuraiseoul

尝试在一个home-searc中分别添加一个两个图像hbar-professor div并使用css属性显示隐藏图像：none或visibility：hidden。它是一种正确的方法，你可以同时使用class和id在同一div – Dineshkani

两个背景CSS使用相同的ID，＃家搜索栏，教授 – Toping

这是它方舟，谢谢，我现在觉得这么愚蠢。 – samuraiseoul

确定这里就是答案： “既背景CSS使用相同的ID，＃家搜索栏，教授”

ty代表和你的CSS是好的顺便说一句

来源

2013-01-03 12:09:20 Toping

非常感谢！只是想给它应有的功劳！ – samuraiseoul

#home-searchbar-professor{ 
    background: url('../img/searchtabs.png') 0 0 no-repeat; 
} 

#home-searchbar-professor{ 
    background: url('../img/searchtabsinactive.png') 0 -64px no-repeat; 
}

都称之为home-searchbar-professor，所以重命名一个home-searchbar-school

来源

2013-01-03 11:57:24 P1nGu1n

CSS想不通为什么DIV消失

回答

相关问题