I've noticed that when we have 2 tabs in a form and have rad textbox controls on both tabs, the tab that is not in focus has controls with different widths than specified in the markup. This is happening in IE 7.0. I have confirmed that this is working properly on all other browsers.
I've attached the source code below:
I've attached the source code below:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="RadControlsWebApp1.WebForm3" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title></title> <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> <style type="text/css"> body { font-family: Arial, Helvetica, Sans-Serif; font-size: 11pt; color: Black; } div.MasterContainer { width: 600px; height: 400px; padding: 0px; margin: auto; margin-top: 40px; } </style></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <%--Needed for JavaScript IntelliSense in VS2010--%> <%--For VS2008 replace RadScriptManager with ScriptManager--%> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <script type="text/javascript"> //Put your JavaScript code here. </script> <div class="MasterContainer"> <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1" SelectedIndex="0" Skin="Hay" Width="100%"> <Tabs> <telerik:RadTab runat="server" Text="Tab1" Value="Tab1" Owner="RadTabStrip1" PageViewID="rpvTab1" /> <telerik:RadTab runat="server" Text="Tab2" Value="Tab2" Owner="RadTabStrip1" PageViewID="rpvTab2" /> </Tabs> </telerik:RadTabStrip> <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0"> <telerik:RadPageView ID="rpvTab1" runat="server" Width="100%" > <table style="padding: 0px; margin: 0px; border-style: none; border-width: 0px; width: 500px;"> <tr> <td> Title: </td> <td> <telerik:RadTextBox ID="RadTextBox1" runat="server" Enabled="true" MaxLength="100" Text="Test" Width="240px"> </telerik:RadTextBox> </td> </tr> <tr> <td> Gender: </td> <td> <telerik:RadComboBox ID="RadComboBox1" runat="server" EmptyMessage="Choose Gender" Width="240px"> <Items> <telerik:RadComboBoxItem runat="server" Text="Male" Value="Male" /> <telerik:RadComboBoxItem runat="server" Text="Female" Value="Female" /> </Items> </telerik:RadComboBox> </td> </tr> </table> </telerik:RadPageView> <telerik:RadPageView ID="rpvTab2" runat="server" Width="100%"> <table style="padding: 0px; margin: 0px; border-style: none; border-width: 0px; width: 500px;"> <tr> <td> Title: </td> <td> <telerik:RadTextBox ID="txtTitle" runat="server" Enabled="true" MaxLength="100" Text="Test" Width="240px"> </telerik:RadTextBox> </td> </tr> <tr> <td> Gender: </td> <td> <telerik:RadComboBox ID="cmbxGender" runat="server" EmptyMessage="Choose Gender" Width="240px"> <Items> <telerik:RadComboBoxItem runat="server" Text="Male" Value="Male" /> <telerik:RadComboBoxItem runat="server" Text="Female" Value="Female" /> </Items> </telerik:RadComboBox> </td> </tr> </table> </telerik:RadPageView> </telerik:RadMultiPage> </div> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> </telerik:RadAjaxManager> </form></body></html>