This is a migrated thread and some comments may be shown as answers.

How to Adjust Alignment of RadWindow Title?

2 Answers 112 Views
Window
This is a migrated thread and some comments may be shown as answers.
Robert
Top achievements
Rank 1
Robert asked on 17 Sep 2013, 11:34 PM
I've tried several things in the CSS file to move a RadWindow's title further to the left.  But can't figure out how to do it.

Here's my layout code:

<telerik:RadWindow ID="rwDeleteMuckMoves" runat="server" Behaviors="Move" EnableShadow="true" VisibleStatusbar="false" VisibleTitlebar="true"
                   Title="Confirm Deletion" BorderColor="Black" AutoSize="true" Modal="true" IconUrl="">
  <ContentTemplate>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
        <div class="dialogMain smallText" style="width:280px; padding:5px 0 0 0">
          <div style="margin-left:auto; margin-right:auto; padding-bottom:5px; text-align:center">
            <div style="text-align:left; padding:0 0 10px 12px">
              <asp:Label ID="labelDeleteMuckMovesIntro" runat="server" />
            </div>
 
            <%--OnClientItemChecked="ControlButtonFromRadListBoxCheckboxes(this, 'buttonDeleteMMTaskOK')"--%>
            <telerik:RadListBox ID="rlbDeleteMMTasks" runat="server" Width="90%" OnItemCreated="rlbDeleteMMTasks_ItemCreated" EnableDragAndDrop="false" CheckBoxes="true">
              <ItemTemplate>
                <div class="smallText" style="text-align:left">
                  <table style="width:100%">
                    <tr>
                      <td class="muckListPrimary" style="width:68%">
                        <asp:Label ID="labelMMtitle" runat="server" />
                      </td>
                      <td style="text-align:right; width:32%">
                        <asp:Label ID="labelMMunits" runat="server" />
                      </td>
                    </tr>
                    <tr>
                      <td style="width:60%">
                        <asp:Label ID="labelMMequip" runat="server" />
                      </td>
                      <td style="text-align:right; width:40%">
                        <asp:Label ID="labelMMdist" runat="server" />
                      </td>
                    </tr>
                  </table>
                </div>
              </ItemTemplate>
            </telerik:RadListBox>
          </div>
 
          <div style="float:right; padding:5px 12px 5px 0">
            <asp:Button ID="buttonDeleteMMTaskOK" runat="server" Text="OK" Width="50" CssClass="smallText" Enabled="false" OnClick="buttonDeleteMMTaskOK_Click" />
               
            <asp:Button ID="buttonDeleteMMTaskCancel" runat="server" Text="Cancel" Width="50" CssClass="smallText" OnClientClick="HideDialog('rwDeleteMuckMoves')" />
          </div>
 
          <div style="height:20px">
              
          </div>
        </div>
      </ContentTemplate>
    </asp:UpdatePanel>
  </ContentTemplate>
</telerik:RadWindow>

2 Answers, 1 is accepted

Sort by
0
Accepted
Shinu
Top achievements
Rank 1
answered on 18 Sep 2013, 06:35 AM
Hi Robert,

You can reduce the space allocated for the RadWindow icon and move the title to the left by setting its margin-left CSS property. Please have a look at the following CSS I tried which works fine at my end.

CSS:
<style type="text/css">
    .RadWindow .rwIcon
    {
        width: 0px !important;
    }
    .RadWindow_Default .rwTable .rwTitlebarControls em
    {
        margin-left: -5px !important;
    }
</style>

Thanks,
Shinu.
0
Robert
Top achievements
Rank 1
answered on 18 Sep 2013, 03:19 PM
Thank you, Shinu!  I had to make one adjustment to what you presented but otherwise followed your lead.

Your use of a -5px shift cut off the first letter of the RadWindow title (on my IE9 in IE7 Compatibility mode) so I changed it to -1px instead.

Robert
Tags
Window
Asked by
Robert
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 1
Robert
Top achievements
Rank 1
Share this question
or