LabelCssClass is inconsitend on 2012Q1 (was fine on 2011Q2)

2 posts, 1 answers
  1. Yuval
    Yuval avatar
    6 posts
    Member since:
    Aug 2010

    Posted 06 Mar 2012 Link to this post


    I've recently upgraded to 2012q1 and noticed that there my labels width start to act freaky. I've a class in my main css that defines the width off all of my labels and suddenly the inputs started not to fill the whole  width set in the RadTextBox. Switching back to the old DLLs works fine.
    Here is simple way to reproduce the issue:
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <head runat="server">
        <style type="text/css">
                display: inline-block !important;
                width: 50px !important;
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <div style="width: 600px">
            <telerik:RadTextBox runat="server" ID="r1" Label="TEXT1" Width="49%" LabelCssClass="labelClass" />
            <telerik:RadTextBox LabelCssClass="labelClass" runat="server"  Width="49%"  ID="RadTextBox1" Label="TEXT2"
                /><br />

     in the attached file it is possiable to see the difference between the outputs.

    I played with it and found that
    the generated HTML is
    <span id="r1_wrapper" class="riSingle RadInput RadInput_Office2010Silver" style="width: 49%;">
    <label id="r1_Label" class="riLabel labelClass" style="width:40%;" for="r1">TEXT1</label>
    <span class="riContentWrapper" style="width:60%;">
    <input id="r1_ClientState" type="hidden" name="r1_ClientState" autocomplete="off">

    so it looks like the custom width set via the CSS is ignored.

    I've noticed that there is new property LabelCssWidth but it will take days to find and change all the label and I don't want to hardcode their width.

    Will this be fixed in 2012Q2  or I should stay with the 2011Q2 ?
  2. Answer
    Vasil avatar
    1642 posts

    Posted 09 Mar 2012 Link to this post

    Hello Yuval,

    As you may know the RadInput has a new rendering from Q1 2012, that does not contain table anymore.
    In your case the input gets its width automatically because it is rendered in table. However with the new rendering this is not possible without custom JavaScript calculations. We are currently researching for any alternatives that we could use in the input, however we are having some difficulties with the styling in IE7.

    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top