如何使容器向右对齐？

Question

我当前的代码呈现出如图 1 的效果，如何才能使输出呈现出如图 2 的效果？

我试图搜索网络，但我找到的大部分结果都显示了如何在 css

中执行此操作

图一，

图二，

                      <ext:Container id="Container1" runat="server" layout="HBoxLayout" width="2000" marginSpec="0 0 10 0" >
                        <Items>   
                      <ext:Panel ID="panel_cms004_view" Title="Document Control Profile" runat="server" AutoScroll="true" Region="East" Height="180" Width="700" Split="true">
                           <Loader ID="cms004_view" runat="server" Url="../CMS/cms004_view.aspx" Mode="Frame" AutoLoad="true" >
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>  


                     <ext:Panel ID="panel_cms004d_audit" Title="Document Control Number - Audit" runat="server" AutoScroll="true" Region="East" Height="180" Width="428" Split="true">
                           <Loader ID="cms004d_audit" runat="server" Url="../CMS/cms004d_audit.aspx" Mode="Frame" AutoLoad="true" >
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>

                      </Items>
                    </ext:Container>

                     <ext:Container id="Container8" runat="server" layout="HBoxLayout" width="2000" marginSpec="0 0 0 0">
                        <Items>   

                      <ext:Panel ID="docControlNum" Title="Document Control Number" runat="server" AutoScroll="true" Region="East" Height="265" Width="700" Split="true">
                           <Loader ID="cms004d_view" runat="server" Url="../CMS/cms004d_view.aspx" Mode="Frame" AutoLoad="true" >
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>     
                        </Items>
                     </ext:Container>

Answer 1

CSS有什么问题？做这样的事情：

.right {
 position: absolute;
 right: 0px;
      }

然后：

<div class="right">
 // your html
</div>

Answer 2

与其创建一个 .css，我建议您使用预先存在的 css，例如 twitter bootstrap css，甚至是具有功能和特性的前端框架效果很好。 Bootstrap 它带有一个网格系统，您可以在其中放置您想要的元素。

Answer 3

                      <ext:Container id="Container1" runat="server" Height="700"  marginSpec="0 0 0 0" Layout="VBoxLayout" >
                        <Items>   
                      <ext:Panel ID="panel_cms004_view" Title="Document Control Profile" runat="server" AutoScroll="true" Height="180" Width="700" Layout="VBoxLayout">
                           <Loader ID="cms004_view" runat="server" Url="../CMS/cms004_view.aspx" Mode="Frame" AutoLoad="true" Height="200">
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>  

                      <ext:Panel ID="docControlNum" Title="Document Control Number" runat="server" AutoScroll="true" Height="248" Width="700" Layout="VBoxLayout">
                           <Loader ID="cms004d_view" runat="server" Url="../CMS/cms004d_view.aspx" Mode="Frame" AutoLoad="true" Height="700">
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>     


                      </Items>
                    </ext:Container>

                     <ext:Container id="Container8" runat="server" marginSpec="0 0 0 700" Layout="VBoxLayout" Height="700" Width="430">
                        <Items>   
                       <ext:Panel ID="panel_cms004d_audit" Title="Document Control Number - Audit" runat="server" AutoScroll="true" Height="425" Width="433"  Layout="VBoxLayout">
                           <Loader ID="cms004d_audit" runat="server" Url="../CMS/cms004d_audit.aspx" Mode="Frame" AutoLoad="true" Height="700" Width="430" >
                                 <LoadMask ShowMask="true"></LoadMask>
                           </Loader>
                      </ext:Panel>
                        </Items>
                     </ext:Container>

做了一些编辑。发现需要在面板和容器的布局中添加。

如何使容器向右对齐？

How to align the container to the right?

html

containers

panel