Strange Appearance / CSS Issue

[Robert]

Please take a look at the first screenshot I've attached.  That's the normal appearance of an editor I've built with the RadTreeView and some other standard controls.  Everything works fine except that testing has revealed one unacceptable peculiarity.

If the browser window is made quite narrow and then a fairly wide Description is chosen in the treeview (and displayed in the accompanying textbox) then everything suddenly shifts over to the left and the editor becomes unusable until the browser is refreshed.

Here's the pertinent layout code:

<div class="content1" style="margin:40px">
  <asp:UpdateProgress ID="UpdateProgress1" runat="server" Visible="true">
    <ProgressTemplate>
      <div id="progress" class="progress">
        <img src="../Images/Progress/indicator_big.gif" />
        <br /><br />
        Please Wait
      </div>
    </ProgressTemplate>
  </asp:UpdateProgress>

  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
      <asp:HiddenField ID="scrollOkay" runat="server" />   <%-- If set true then the tree's scrollIntoView function will be used. --%>

      <asp:Panel ID="panelPath" runat="server" Width="720px" style="padding:5px">
        Path: <asp:Label ID="labelPath" runat="server" Text="" style="font-weight:bold" />
      </asp:Panel>

      <div style="height:15px"></div>

      <asp:Panel ID="panelTree" runat="server" Width="350" Height="500" BorderColor="DarkGray"
                 BorderStyle="Groove" BorderWidth="1" style="float:left">
        <telerik:RadTreeView ID="treeViewMain" runat="server"
                             ExpandAnimation-Duration="5"
                             ShowLineImages="true"
                             OnNodeExpand="treeViewMain_NodeExpand"
                             OnNodeClick="treeViewMain_NodeClick"
                             MultipleSelect="false"
                             AllowNodeEditing="false"
                             EnableDragAndDrop="true"
                             OnNodeDrop="treeViewMain_NodeDrop"
                             Height="500px" Width="350px"
                             style="background-color:#F0F8FF"
        />
      </asp:Panel>

      <div style="width:30px; float:left"></div>

      <asp:Panel ID="panelFields" runat="server" Width="340" Enabled="false" BorderColor="DarkGray" BorderStyle="Solid" BorderWidth="1" style="float:left; padding:10px">
        <asp:Table ID="tableFields" runat="server" CellSpacing="5">
          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="Type:" />
            <asp:TableCell>
              <asp:DropDownList ID="dropDownListType" runat="server" Width="240px" AutoPostBack="true"
                                OnSelectedIndexChanged="dropDownListType_SelectedIndexChanged" />
            </asp:TableCell>
          </asp:TableRow>

          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="SubType:" />
            <asp:TableCell>
              <asp:DropDownList ID="dropDownListSubType" runat="server" Width="240px" AutoPostBack="true"
                                OnSelectedIndexChanged="dropDownListSubType_SelectedIndexChanged" />
            </asp:TableCell>
          </asp:TableRow>

          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="Description:" />
            <asp:TableCell>
              <asp:TextBox ID="textBoxDescription" runat="server" Width="236px" AutoPostBack="true" OnTextChanged="textBoxDescription_TextChanged" />
            </asp:TableCell>
          </asp:TableRow>

          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="Equip No.:" />
            <asp:TableCell>
              <asp:TextBox ID="textBoxEquipNo" runat="server" Width="50" style="text-align:right; padding-right:1px" AutoPostBack="true"
                           OnTextChanged="textBoxEquipNo_TextChanged" />
            </asp:TableCell>
          </asp:TableRow>

          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="MIMS:" />
            <asp:TableCell>
              <asp:TextBox ID="textBoxMims" runat="server" Width="50" style="text-align:right; padding-right:1px" AutoPostBack="true"
                           OnTextChanged="textBoxMims_TextChanged" />
            </asp:TableCell>
          </asp:TableRow>

          <asp:TableRow>
            <asp:TableCell HorizontalAlign="Right" style="padding-right:7px" Text="Quantity:" />
            <asp:TableCell>
              <asp:TextBox ID="textBoxQuantity" runat="server" Width="50" style="text-align:right; padding-right:1px" AutoPostBack="true"
                           OnTextChanged="textBoxQuantity_TextChanged" />
            </asp:TableCell>
          </asp:TableRow>
        </asp:Table>
      </asp:Panel>
    </ContentTemplate>
  </asp:UpdatePanel>

  <div style="position:absolute; left:275px; top:762px; font-size:12px">
    <asp:LinkButton ID="linkButtonEquipSubtypeEditor" runat="server" Text="Equipment Subtypes" PostBackUrl="~/Editors/equipSubtypeEditor.aspx" style="color:Blue" />
  </div>
</div>

I've tried several different approaches to resolving this problem.  I really don't understand why the RadTreeView shifts to the left just because a string in a TextBox is long.  Or to look at it another way, why does a Panel control, which is the parent of the the TextBox shift over to the left just because a string in that TextBox is long?

Any suggestions would be much appreciated!

Robert

[Boyan Dimitrov]

Hello Robert,

Thank you for contacting Telerik Support.

Could you please share your specific implementation of populating the Description text box field. I tried to reproduce that issue by implementing the following expression in the RadTreeView NodeClick server-side event handler, but I could not replicate that shifting behavior.
//code behind

protected void treeViewMain_NodeClick(object sender, RadTreeNodeEventArgs e)
    {
        textBoxDescription.Text = e.Node.Text;
    }

Any additional information about your scenario would be highly appreciated in order to reproduce that issue locally and be more helpful. 

Regards,
Boyan Dimitrov
the Telerik team

[Robert]

Boran,

The thing is, I'm not even sure if the problem is directly related to your TreeView.  It might be, it might not be.  But I don't believe it's related to the population of the TreeView itself.

This is a low-priority issue for me so let's leave it for now.

Thank you for getting back to me though!

Robert