0

在 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;
}
4

3 回答 3

0 
#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;
}
于 2013-03-15T10:40:45.163 回答
0

我去了你的网站，和 Chrome 的检查员一起玩，找到了答案。

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

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

希望这可以帮助

于 2013-03-15T10:41:25.293 回答
0

抱歉，我没有收到您的问题...在您链接的页面中，即使您调整窗口大小，#userarea div 也始终可见。

要完整查看#logo div，请从父div #header 中删除“height”属性，如果窗口不够大，它将换行。

于 2013-03-15T10:42:05.147 回答