由于解决方案导致的职位变

Question

当前的模型用户界面只能在Firefox中正常工作（如预期）。

根据屏幕分辨率，我的白色边框的位置不同。

在800 x 600和1024 x 768中，边框向左对齐：

---

在1280 x 1024中，它显示为我想要的，居中：

HTML代码段为：

 <div id="comment_middle">
        <a id="topcomment"></a>
        <div id="comment_top"><center><p id="commentshdr">عدد الردود: 0</p></center></div>
          <div id="commentcontent">
               <div id="no_comments"><center><b><font color="purple" size="4">لاتوجد ردود</font></b></center></div>
                </div>


        <a id="posted"></a>
           <div id="maincmnt">
               <p>الــرد على الموضوع</p>
               <fieldset>
               <form action="po.php?id=499#posted" method="POST">
                    <!--<input type="hidden" name="posted" value="#posted" />-->
                    <input name="id" value="499" type="hidden">
                    <input name="page" value="1" type="hidden">
                    <textarea rows="20" cols="60"></textarea><br>
                    <div id="replybutton_content">
                        <div id="userbadge-register"><center><a href="#" target="_blank">سجل في الموقع الآن لتستطيع التواصل مع العضو</a></center></div>
                    </div>               </form>
               </fieldset>
           </div>

        <div id="comment_bottom"></div>
    </div> 

我附上了一个div，它收集上面提到的所有div，以便能够立刻移动整个集合，因为边框被分成几个部分，所以我需要某种div来收集它们：

<div style="margin-right: 20%;">
//the above html block
</div>

我改变了不同的大小作为margin-right：20％，padding-right等。在一个屏幕分辨率中总是有一个额外的对齐。例如，如果边框以1280 x 1024为中心，则较小分辨率的边框与左侧对齐。如果边框以较小的分辨率居中，则边框在1280 x 1024中向右对齐。 我希望它们全部显示在快照＃3的相同位置。知道如何解决这个问题吗？

感谢。

Answer 1

在div＃comment_middle

上试试这个

<div id="comment_middle" style="margin: 0 auto;">

并删除其父级的边距。

Answer 2

您的整个内容区域需要一个外部包装器。给它一个固定的（假设它是960）：

.wrapper {
    width:960px;
    margin-left:auto;
    margin-right:auto;
}