Compatibility View layout issues

2 posts, 0 answers
  1. Ahrensberg
    Ahrensberg avatar
    73 posts
    Member since:
    Mar 2009

    Posted 21 Feb 2011 Link to this post

    Hi all,

    I've encounted some layout issues at my page after setting IE8 to running in Compatibility View.

    One issue is in using RadButton with an icon. I've created a small sample project which code is shown beneath, and layout difference is attached this thread.

    Can anyone tell me why these difference occurs? And how to solve the issue...?

    ASPX Code:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <head runat="server">
        <style type="text/css">
              top: 4px !important;
              left: 5px !important;
              height: 32px !important;
              width: 32px !important;
        <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                <%--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" />
        <script type="text/javascript">
            //Put your JavaScript code here.
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <telerik:RadButton runat="server" ID="RadButton1" Text="Go to basket" Height="40px" Width="200px" EnableBrowserButtonStyle="true">
                <Icon PrimaryIconUrl="App_Themes/Default/Graphics/shopping_cart_lrg.png" PrimaryIconCssClass="iconStyle" />
  2. Pero
    Pero avatar
    1156 posts

    Posted 21 Feb 2011 Link to this post

    Hi Ahrensberg,

    This problem existed in some of the previous versions of the RadButton control, but has been fixed in the latest release. Could you please upgrade your application to use the latest version of our controls, and see if the issue is resolved?
    The following CSS will resolve the issue without the need for updating:
    <style type="text/css">
        .RadButton input
            height: 40px !important;

    All the best,
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
Back to Top