Div標記一個JQuery UI

我正在處理一個窗口小部件控件。該小部件被動態加載到小部件容器中。小部件容器包含一個容納小部件的div，這被稱爲小部件區域。使用JQuery UI可以將容器容器製作爲可拖動和可調整大小。Div標記一個JQuery UI

我遇到的問題是，按鈕區的底部利潤率似乎沒有工作或也許我misuderstanding利潤率如何工作。左上角和右邊距工作正常，我將它們設置爲20px，因此小部件區域距小部件容器的左上角和右側20px。底部邊距也是20px，但小部件區域的底部距小部件容器底部的距離遠大於20px。我已經嘗試在Firefox中，併發生同樣的問題。

當我調整控件容器按鈕區的左側也重新調整，因爲然而小部件的底部是完全不調整邊距，因爲底部的利潤似乎並不奏效。

這裏是我的小部件容器和CSS。

<asp:Panel ID="Panel1" CssClass="widgetcontainer" runat="server" Height="500px" BorderStyle="Solid" BorderWidth="1px" Width="485px" BackColor="White"> 
    <asp:Panel ID="Panel2" CssClass="widgetcontainerheader" runat="server"> 
     <asp:Label ID="Label2" runat="server" Text="Gadget header"></asp:Label> 
    </asp:Panel> 

    <asp:Panel ID="WidgetBodyPanel" CssClass="widgetarea" runat="Server" BorderStyle="Solid"> 
     <p> 
      some text 
     </p> 
    </asp:Panel> 

</asp:Panel> 

div.widgetcontainerheader 
{ 
    background-color:#CCFF99; 

    border-bottom-style:solid; 
    border-bottom-width:thin; 
    border-bottom-color:#D2D2D2; 

    position: relative; 
    width:100%; 
    height:20px; 
} 

.widgetarea 
{ 
    position:relative; 

    margin-left:20px; 
    margin-top:20px; 
    margin-right:20px; 
    margin-bottom:20px; 

}

有人請告知爲什麼底部邊距不起作用？

謝謝

來源

2011-09-30 There is no spoon

您已將widgetcontainer的高度設置爲500px。

我要說的是widgetarea確實有20像素的邊距，但因爲按鈕區沒有高度似乎比大。也許設定高度：100％。

.widgetarea 
{ 
    margin: 20px; 
    height: 100%; 
}

順便說一句，很值得調試這些煩人的UI問題安裝http://getfirebug.com/。

來源

2011-10-01 00:24:10

Div標記一個JQuery UI

回答

相關問題