Question

我试图在容器中包含内容，但我无法这样做！这是我使用的代码。我知道他们可能是错误。我做错了什么？

CSS：

.container {
    max-width: none !important;
    width: 960px;
}

.rectangle {
    min-height: 40px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    height: 65px;
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    border-radius: 0px;
    background-color:#67518e;

}

HTML：

<div class="rectangle"> 
  <div class="container">
    <a href="" style="float:left;color:white;">sample1</a>
    <a href="" style="float:right;color:white;">sample2</a>
  </div>
</div>

Answer 1

好的，现在我得到想要成就的东西。

要包装并水平居中（我假设你想要这样做），你需要

margin: 0 auto;

到.container

注意：由于position: fixed;

，因此不会有任何水平滚动

提示：如果您创建css，请执行此选择器树

.rectangle{}

然后

.rectangle .container{}

这里是示例JSFIDDLE

Answer 2

试试这个：

＆＃13;

 <!DOCTYPE>
    <html>
    <head>
    <title>sample</title>
    <style>
    .container {
        max-width: none !important;
        width: 960px;
    }
    
    .rectangle {
        min-height: 40px;
        margin-bottom: 20px;
        border: 1px solid transparent;
        height: 65px;
        position: fixed;
        top: 0px;
      //  right: 0px;
        left: 0px;
        border-radius: 0px;
        background-color:#67518e;
    
    }
    </style>
    </head>
    <body>
        <div class="container"> 
            <div class="rectangle">
                <a href="" style="float:left;color:white;">sample1</a>
               &nbsp;&nbsp;&nbsp; <a href="" style="float:right;color:white;">sample2</a>
            </div>
        </div>  
    </body>
    </html>

＆＃13;

容器未包装内容

2 个答案: