0

我是 ASP 和 CSS 的新手,所以我不怀疑这个问题对许多人来说似乎非常基础。

我正在尝试创建一个网页,其中左侧有一个面板,右侧有一个面板,主要内容介于两者之间。

我的标记如下所示 -

 <body>
    <div id="Header">
        <a id="A1" runat="server"></a>
    </div>
    <div id="LeftPanel">
        This is my LeftPanel</div>    
    <form id="form1" runat="server">
    <div id="MainContent">
        <asp:ContentPlaceHolder ID="cpMainContent" runat="server">
        </asp:ContentPlaceHolder>
    </div>
    <div id="RightPanel">
        This is my RightPanel</div>
    </form>
</body>

我有一个单独的 CSS 文件来提供布局细节,内容如下 -

#LeftPanel
{
    margin-left: 100px;  
    margin-top: 50px;
    margin-right: 25px;
    border-width: 1px;
    border-style: ridge;
    border-color: rgb(0, 165, 240);
    width: 200px;
    height: 500px;
    float: left;
}

#MainContent
{
    color: Black;
    margin-left: 120px;  
    margin-top: 50px;
    margin-right: 25px;
    width: 1000px;
    height: 500px;
}

#RightPanel
{    
    margin-top: 50px;
    border-width: 1px;
    border-style: ridge;
    border-color: rgb(0, 165, 240);
    width: 200px;
    height: 500px;
}

现在我的 LeftPanel 根据需要出现在屏幕的左侧,我的 MainContent 出现在 LeftPanel 的右侧(再次按计划)。但是,由于我无法解决的原因,我的 RightPanel 出现在屏幕左侧以及 LeftPanel 和 MainContent 分区下方。

我很确定这会很简单,但就像我说的,我对 ASP 和 CSS 很陌生。

4

1 回答 1

3

添加

float: left;

到#MainContent 和#RightPanel

我也想知道,如果这有点太多了: width: 1000px;

于 2013-06-28T11:25:54.720 回答