有人可以解释为什么我的右班级弹出对吗？

只是寻找一个很好的解释，以便我明白为什么会发生这种情况，以便将来我可以正确地做到这一点。一切都很好，除了正确的课程是正确的。我不明白的是，因为标题的位置是固定的，为什么它会在顶部/底部呢？从本质上来说，什么样的定位使它能够很好地坐在哪里？有人可以解释为什么我的右班级弹出对吗？

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
     <title></title> 
    </head> 
    <body> 

    <div id="header"></div> 
    <div class="left"></div> 
    <div class="right"></div> 
    <div id="footer"></div> 

    </body> 
</html>

CSS：

#header { 
    border-radius: 5px; 
    height: 60px; 
    width: 500px; 
    background-color: red; 
    position: fixed; 
    z-index: 1; 
} 

.left { 
    border-radius: 5px; 
    height: 500px; 
    width: 70px; 
    background-color: blue; 
    float: left; 
} 

.right { 
    border-radius: 5px; 
    height: 500px; 
    width: 430px; 
    background-color: black; 
    float: right; 
    position: relative; 

} 

#footer { 
    border-radius: 5px; 
    height: 60px; 
    width: 500px; 
    background-color: red; 
    clear: both; 
}

来源

2014-01-14 Liam Coates

我不知道，我明白你的要求的。也许你的问题可以通过添加“top：0; left：0;”来解决在你的头文件的CSS中。 – AleVale94

它必须是float:left，而不是float:right，否则它会占用容器（在这种情况下是机构）自行调节在 - 的右边。否则，您可以将宽度增加到100％。

检查：http://jsfiddle.net/abhitalks/K6fXE/

.right { 
    float: left; 
    ... 
}

来源

2014-01-14 10:29:04 Abhitalks

非常感谢 - 现在有道理。 –

有人可以解释为什么我的右班级弹出对吗？

回答

相关问题