I have what I thought was a relatively simple screen layout. I have a set of RadButtons within a repeater acting as check boxes. The list is rather long so I've put the repeater inside an ASP:Panel with a vertical scroll bar. This works perfectly in Chrome and FireFox. Unfortunately the display is distorted in Internet Explorer 10. The display of RadButtons extends far beyond the bounds of the panel. Actually it looks like the labels are scrolling but not the buttons.
(I see this was a problem back in IE6 & 7??? Tried variations on solutions mentioned back then but no luck so far.)
Image attached.
<asp:Panel runat="server" ScrollBars="Vertical" Height="425px">
<asp:Repeater runat="server" ID="rpApps" >
<HeaderTemplate>
<table style="margin-left: auto; margin-right: auto; width: 80%">
<tr>
<td style="width: 50%; text-align: center">
<asp:Label Width="225px" ID="label1" runat="server" Font-Bold="true" Text='Application' Font-Names="Arial" Font-Size="Medium"></asp:Label>
</td>
<td style="width: 50%; text-align: center">
<asp:Label Width="75px" ID="label2" runat="server" Font-Bold="true" Text="Select" Font-Names="Arial" Font-Size="Medium"></asp:Label>
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table style="margin-left: auto; margin-right: auto; width: 80%">
<tr>
<td style="width: 50%; text-align: left">
<asp:Label Width="225px" ID="lblAppDesc" runat="server" Text='<%# Bind("DetDesc") %>' Font-Names="Arial" Font-Size="Small"></asp:Label>
</td>
<td style="width: 50%; text-align: center">
<telerik:RadButton ID="chkSelectApp" runat="server" ButtonType="ToggleButton" Checked='<%# Bind("IsNew") %>' Text="" ToggleType="CheckBox" Font-Names="Arial" Font-Size="Small" AutoPostBack="false" CausesValidation="false" EnableViewState="true">
</telerik:RadButton>
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
</asp:Panel>
(I see this was a problem back in IE6 & 7??? Tried variations on solutions mentioned back then but no luck so far.)
Image attached.
<asp:Panel runat="server" ScrollBars="Vertical" Height="425px">
<asp:Repeater runat="server" ID="rpApps" >
<HeaderTemplate>
<table style="margin-left: auto; margin-right: auto; width: 80%">
<tr>
<td style="width: 50%; text-align: center">
<asp:Label Width="225px" ID="label1" runat="server" Font-Bold="true" Text='Application' Font-Names="Arial" Font-Size="Medium"></asp:Label>
</td>
<td style="width: 50%; text-align: center">
<asp:Label Width="75px" ID="label2" runat="server" Font-Bold="true" Text="Select" Font-Names="Arial" Font-Size="Medium"></asp:Label>
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table style="margin-left: auto; margin-right: auto; width: 80%">
<tr>
<td style="width: 50%; text-align: left">
<asp:Label Width="225px" ID="lblAppDesc" runat="server" Text='<%# Bind("DetDesc") %>' Font-Names="Arial" Font-Size="Small"></asp:Label>
</td>
<td style="width: 50%; text-align: center">
<telerik:RadButton ID="chkSelectApp" runat="server" ButtonType="ToggleButton" Checked='<%# Bind("IsNew") %>' Text="" ToggleType="CheckBox" Font-Names="Arial" Font-Size="Small" AutoPostBack="false" CausesValidation="false" EnableViewState="true">
</telerik:RadButton>
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
</asp:Panel>