Question

当我调整页面大小时，我网站上的元素不断移动。无论屏幕分辨率如何，我希望它们保持固定。这是我网站的CSS代码：

我尝试使用包装器，但它会让一切都搞乱。

任何帮助将不胜感激：）

#leftmenu {
    margin-left:5px;
    margin-top:5px;
    height:auto;
    width:150px;
    background-color:gray;

}
#leftmenu .titlebox {
    height:20px;
    width:150px;
    background-color:black;
}
#leftmenu .titlebox .text {
    margin-left:10px;
    font-family:OswaldL;
    font-size:14px;
    color:white;
}
/*Droite Debut*/
 #rightmenu {
    margin-left:5px;
    margin-top:5px;
    height:auto;
    width:220px;
    background-color:gray;
}
#rightmenu .titlebox {
    height:20px;
    width:250px;
    margin-right:2px;
    background-color:black;
}
#rightmenu .titlebox .text {
    margin-left:10px;
    font-family:OswaldL;
    font-size:14px;
    color:white;
}

.rightt{
    right: 296px;
    margin-right:4px;
    position: absolute;
}

.leftt, .rightt {
    display: inline-block;
}

.milieu {
    display: inline-block;
    vertical-align: top;
    margin-left: 150px;
}

谢谢：）

Answer 1

从查看你的css我可以看出你使用的是固定布局，所以在你通过使用

使其响应之前，响应性将无法对它们起作用

宽度百分比
媒体查询

尝试分享HTML代码，以便获得更好的帮助

Answer 2

<div id="base">

    <div class="leftt">
        <div id="leftmenu">
            <div class="titlebox"><div class="text"><?php echo NOM_SITE;?></div></div>
            <ul>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
            </ul>
        </div>

            <?php
                if(isset($_SESSION['pseudo']))
                {
            ?>

        <div id="leftmenu">
            <div class="titlebox"><div class="text">account</div></div>
            <ul>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
            </ul>
        </div>



            <?php
                }   
            ?>

        <div id="leftmenu">
            <div class="titlebox"><div class="text">Int</div></div>
            <ul>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
            </ul>
            </div>

        <div id="leftmenu">
            <div class="titlebox"><div class="text">abt</div></div>
            <ul>
                <li><a href="#">Link</a></li>
            </ul>
            </div>


</div>

<div class="rightt">
        <div id="rightmenu">
            <div class="titlebox"><div class="text">Forums</div></div>
            <div class="droite_text">
                <li><a href="#">Link</a></li>
            </div>
        </div>

        <div id="rightmenu">
            <div class="titlebox"><div class="text">other</div></div>
            <div class="droite_text">
            $connectes
            </div>
        </div>
</div>
<div class="milieu">

这是HTML：）

调整页面大小时停止元素移动

2 个答案: