0

我试图做一个简单的页面来占据整个浏览器窗口。它只包含两个元素，问题是第二个元素与第一个元素重叠

form 
{
    background-color:#996600;
    width:30%;
    height:100%;
    float:left;    
    font:"Arial Black", Gadget, sans-serif;
    color:#FFF
}

#risultati 
{
    width:70%;
    background-color:#0099FF;
    font:"Arial Black", Gadget, sans-serif;
    color:#FFF
}


<body>

<form action"">
 <label>Inserisci ragione sociale</label>
   <input name="chiave" onkeyup="showHint(this.value)"/>

 <!-- <input type="submit"/> -->
</form>

<p id="risultati">Risultati: <span id="txtHint"></span></p> 


</body>

哪里有问题？

编辑：我注意到重叠只影响第二个元素的背景属性（“Risultati”字通常是浮动的）。我希望背景从第一个元素的结尾开始占据浏览器的其余空间。相反，它从第一个元素所在的浏览器左侧开始。

4

1 回答 1

3

一个元素是float: left，而另一个不是；这导致了重叠。尝试在 CSS 中添加float: left声明#risultati：

#risultati 
{
    width:70%;
    background-color:#0099FF;
    font:"Arial Black", Gadget, sans-serif;
    color:#FFF;
    float: left;
}
于 2013-02-08T16:55:38.663 回答