2016-11-24 7 views
2

Мой текущий код отображает как Изображение 1, как я могу получить результат для рендеринга, как картинка 2?Как выровнять контейнер вправо?

Я пытался найти в Интернете, но большинство результатов я нашел показать, как это делается в css

Pic один, enter image description here

Pic два,

enter image description here

     <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> 
+0

Не уверен, что это именно то, что вы хотите, но попробуйте настроить поток: слева для обоих, а затем установите margin-right в левый контейнер. – malutki5200

+0

Вместо того, чтобы использовать компоновку контейнера 1, как вы сейчас делаете, попробуйте компоновку контейнера 2. http://imgur.com/a/RUi4K – josephting

+0

@josephting Я хочу сделать как макет контейнера 2, но мой вывод кода - это компоновка контейнера 1. что я должен изменить, чтобы получить результат, такой как макет контейнера. 2. – David

ответ

0

В чем проблема с CSS? сделать что-то вроде этого:

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

, а затем:

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

вместо создания .css я бы рекомендовал вам использовать уже существующие CSS, как Twitter Bootstrap CSS или даже рамки внешнего интерфейса, который они имеют функцию и функции, которые работают очень хорошо. С помощью Bootstrap появляется сетка, в которой вы можете разместить свои элементы так, как хотите.

2
     <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> 

Сделал некоторые изменения. Выяснилось, что нужно добавить в макет панели и контейнера.