Question

我有2个DIV，如下所示我如何将它放在页面上并排并居中。下面没有运气。在此先感谢

现在我的CSS是：

#content
  {
  height: 100%;
  position:fixed;
  width:1400px;
  /*width: 1200px;  position: absolute;  top:auto;  bottom:0px;  right:0px;  left:auto; */

}


#left{
    float:left;
    width:700px;   
    position:absolute;
    top:auto;  bottom:720px;  right:700px;  left:auto; 

}

#right{
    width: 700px;
    float:right;
    position:absolute;
   top:auto;  bottom:750px;  right:-90px;  left:600; 
}


<div id="content">
            <div id="left">
                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSourceScanned">
                    <AlternatingRowStyle CssClass="altrowstyle" />
                    <HeaderStyle CssClass="headerstyle" />
                    <RowStyle CssClass="rowstyle" />
                    <SelectedRowStyle BackColor="#004080" Font-Bold="True" ForeColor="Yellow" />
                    <Columns>

                    </Columns>
                </asp:GridView>

            </div>



            <div id="right">
                <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSourceMade">
                    <AlternatingRowStyle CssClass="altrowstyle" />
                    <HeaderStyle CssClass="headerstyle" />
                    <RowStyle CssClass="rowstyle" />
                    <SelectedRowStyle BackColor="#004080" Font-Bold="True" ForeColor="Yellow" />
                    <Columns>

                    </Columns>
                </asp:GridView>
                </div>
            <div style="clear: both;">
            </div>
        </div>

Answer 1

试试这个CSS样式

#content
  {
  height: 100%;
  width:1400px;
  margin:0 auto;

}
#left{
    float:left;
    width:700px;   
}

#right{
    width: 700px;
    float:right;
}

Answer 2

最好的方法是：

#left{
 display:inline;
}

#right{
display:inline;
}

Answer 3

我在此代码中看到的唯一问题是top:auto

给出一些特定的距离。并且对于水平中央对齐，使用左侧和左侧的text-align:center;。对吧

如何并排修复2个DIV

3 个答案: