父div中的div在调整大小时重叠

Question

在CSS方面我不是一个真正的冠军，所以我希望我能得到一些帮助。

现在我有一个父div和两个子div。目前，每当我调整浏览器的大小时，这两个div都会相互重叠。我希望左边的div在任何时候都是可见的。

可以在这里查看:http://unlimitedbrettworks.com/forums/

CSS:

#header {
     position: relative;
     height: 140px;
     overflow: hidden;
     background-color: #E1E1E1; }
#logo a {
    overflow: hidden;
    float: right;
    width: 620px !important;
    height: 190px !important;
    cursor: pointer;
    background: url(../images/art/logo.png) no-repeat;
}
#userarea {
    float: left;
    margin: 0 1em; 
    padding: 1.5em 1em 0 1em;
    text-align: left;
    font-size: 0.95em;
    width: 38em;
    color: #313131;
    font-family: tahoma, sans-serif;
    line-height: 130%;
}
#userarea a:link, #userarea a:visited {
    color: #333333;
}
#userarea a:hover {
    color: #800000;
    text-decoration: underline;
}

Answer 1

#header {
     position: relative;
     height: 140px;
     overflow: hidden;
     background-color: #E1E1E1; }
#logo a {
    overflow: hidden;
    float: right;
    width: 620px !important;
    height: 190px !important;
    cursor: pointer;
    background: url(../images/art/logo.png) no-repeat;
}
#userarea {
    float: left;
    margin: 0 1em; 
    padding: 1.5em 1em 0 1em;
    text-align: left;
    font-size: 0.95em;
    width: 38em;
    color: #313131;
    font-family: tahoma, sans-serif;
    line-height: 130%;
    height: 122px; /* is value is the height min the padding you use.*/
}
#userarea a:link, #userarea a:visited {
    color: #333333;
}
#userarea a:hover {
    color: #800000;
    text-decoration: underline;
}

这是第一个问题。第二个是在css文件的第128行。

div#wrapper
{
    margin: 0 auto;
    min-width: 764px;
    max-width: 2300px;
    border: 10px solid #333333;
}

需要是:

div#wrapper
{
    margin: 0 auto;
    min-width: 1024px;
    max-width: 2300px;
    border: 10px solid #333333;
}

Answer 2

我去了你的网站，玩了Chrome的检查器，找到了一个答案。

尝试将这些属性添加到#userarea:

#userarea {
  position: absolute;
  background-color: #E1E1E1;
  height: 100%;
}

希望能有所帮助

Answer 3

对不起，我没明白你的问题…在你链接的页面中，#userareadiv总是可见的，即使你调整了窗口的大小。

要完全看到#logodiv，从父div #header中删除'height '属性，如果窗口不够大，它将在新行上。