在CSS中，边距和溢出不起作用

我是CSS新手。我正在建立一个网页，将有3列-左边一个用于导航，中间一个用于页面内容，右边一个用于外部链接和注释。首先，当我以百分比表示宽度时，溢出正在工作。现在溢出不起作用，右边框也消失了。这是我的密码。请帮帮我。提前谢谢

//Total pixels: 1366px. (I found this after running a given code on www.w3schools.com).

#rightcontentborder {
    border: 2px solid;
    padding: 5px;
/*  border-radius: 1em;*/

//Left-margin = 1366 - 716 = 650px.
    margin-left: 650px;         
    margin-right:1366px;        

//  width:50px;
    height:700px;
//  overflow:scroll;
    float: right;
    position: absolute;
}

#maincontentborder {
    border: 2px solid;
    padding: 5px;
//  background: #dddddd;

    margin-left: 216px;         
//Given width=500px.
//Right-margin = 1366 - (216+500) = 1366-716 = 650px.
    margin-right: 650px;        

//  width: 100px;
    height: 700px;

    overflow: scroll;
//  float: center;
}

#leftcontentborder {
    border: 2px solid;
    padding: 5px;
//  background: #dddddd;
/*  border-radius: 1em;*/

    margin-left:0px;        /*I have added this line to adjust the left margin of the LEFT content*/
    margin-right:1150px;    /*I have added this line to adjust the right margin of the LEFT content*/
//Width = 1366-1150 = 216px.

    height:700px;

//  float: left;
    position: absolute;
}

---

如果我准确地得到你的要求，你需要3栏的页面。你写的css不准确。您必须使用

float

来实现此目的。让我们看看预期的html

<div class="container">
    <div class="left-content">
        <!-- left sidebar content --> 
    </div>
    <div class="main-content">
        <!-- main content -->
    </div>
    <div class="right-content">
        <!-- right sidebar content -->
    </div>
</div>

---

尝试了解css相对于html的用法。并根据您的尺寸进行定制。祝你好运

请分享你的

HTML

。是的，没有HTML我们无能为力。谢谢你的关心。我应该提供HTML代码，以便您更好地理解我的问题。Eranga Kapukotuwa先生提供的代码帮助我解决了这个问题。这是我的HTML代码：在上面这一行之后，我按Enter键获得了一个新行，这样我就可以提供我的HTML代码，但是它没有我的代码就被提交了。我的HTML代码不适合这里。事实上，我不知道如何将我的HTML代码附加到我的问题中。请告诉我程序好吗？

.container {
    overflow: hidden;
    width: 100%;
    max-width: 1200px; 
}

.left-content {
    width: 25%;
    max-width: 300px;
    float: left;
    min-height: 700px;
}

.right-content {
    width: 25%;
    max-width: 300px;
    float: left;
    min-height: 700px;
}
.main-content {
    width: 50%;
    max-width: 600px;
    float: left;
    min-height: 700px;
}