asp:Label font-family not affected

16 posts, 0 answers
  1. Seth
    Seth avatar
    90 posts
    Member since:
    Jun 2007

    Posted 05 Jun 2009 Link to this post

    I am using the FormDecorator to control the look and feel of my site.

    After reading...

    Telerik ASP.NET FormDecorator allows you to beautifully style 10 types of elements: Buttons, CheckBoxes, RadioButtons, Fieldset, TextBox, Textarea, Labels, H4, h5, H6.

    ...I assumed that the Form Decorator would change the appearance of any asp:Label on my form.  In fact, it does!  However, it only seems to change the color and not the font-family to match the currently selected skin.  Is this a bug or a design flaw or something I am doing wrong?

    Thanks.
  2. Martin
    Admin
    Martin avatar
    585 posts

    Posted 07 Jun 2009 Link to this post

    Hi Seth,

    No, it is not a bug at all. <asp:label /> is a server control that renders a <span />, not a <label /> tag. RadFormDecorator styles only form controls and headings (<H3 /> - <H6 />), not arbitrary HTML. On the other hand, although it changes the color of these (as well as the bottom border of the headings), it does not affect the font-family. What it does is leaving these to the browser defaults or inheriting the ones that are set by the developer. font-family is a highly layout-oriented property, and it is up to the designer / developer to decide on which font to use, not up to RadFormDecorator.

    Sincerely yours,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Seth
    Seth avatar
    90 posts
    Member since:
    Jun 2007

    Posted 08 Jun 2009 Link to this post

    Hi Martin,

    Thank you for your reply.

    To me it doesn't seem like it was a choice to not incorporate the font-family into the Form Decoorator but more of an oversight.  If I am trying to make my forms universally the same, would I also not want to have the font-family be the same across the site?  If I am using your Form Decorator to accomplish this, should not my fonts on all my text be the same as what is in all the RadControls that come from the current skin I have applied?  Instead of saying that <asp:Labels /> are not supported and then commenting that even though they are not supported the properties are affected by the Form Decorator, how about saying that Form Decorator does not currently support font-family which actually appears to be the case and would have been an honest answer instead of the cop out you supplied me.
  5. Tervel
    Admin
    Tervel avatar
    1337 posts

    Posted 11 Jun 2009 Link to this post

    Hi Seth,

    The FormDecorator styles certain elements in a certain way for certain reasons. If we take <label> elements as an example, It is not the intention of the control to set every imaginable CSS property available for 100% custom stylization of the tag. For reasons already explained, the font-family is not set, as it can indirectly affect element height (e.g. Times New 11 is less than Courier 11) - which will cause flicker while decoration is performed.

    If you wish, you can assume that the Form Decorator does not currently support font-family - for the reasons explained.

    Best regards,
    Tervel
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Cezar
    Cezar avatar
    15 posts
    Member since:
    Mar 2010

    Posted 09 Nov 2010 Link to this post

    Hello Martin.

    I read everything you answered and I need you to help me solve this little problem.

    Correct me if i'm wrong but, you're telling me that RadFormDecorator doesn't apply styles on a asp:Label element, correct?

    Ok, but my system was entirely built using asp:Label before the user controls, I would have no problem changing asp:Label to the HTML element <label> BUT, how can I insert a RESX content into a <label>?

    I tryed to do this without success.

    If the <label> doesn't support RESX content then what's the point on using it?

    You need to apply styles over asp:Label, or tell me how to put RESX content inside a <label> element,

    I'll be waiting for your response.

    Thanks in advance.

    Cezar
  7. Cezar
    Cezar avatar
    15 posts
    Member since:
    Mar 2010

    Posted 11 Nov 2010 Link to this post

    I already found a way of doing this.

    If anyone needs help doing the same thing just reply and i'll post what I did to solve this issue.

    Thanks!

    Cezar
  8. Marco
    Marco avatar
    25 posts
    Member since:
    Oct 2010

    Posted 22 Nov 2010 Link to this post

    Hi Cezar,

    I have the same problem.
    I do  also like to style all my controls the same.

    Can you give me your answer?

    Cheers,

    Marco

  9. Cezar
    Cezar avatar
    15 posts
    Member since:
    Mar 2010

    Posted 22 Nov 2010 Link to this post

    Hello Marco !

    Offcourse! This is what I did.

    1) I created a class that derives from HtmlGenericControl;
    2) Then a created a property to it that I called Text;
    3) This property changes the InnerHtml property of the control;
    4) I also added a bool property to add (or not) an automatic ":" in front of the final Label.

    public class MyLabel : HtmlGenericControl
    {
        public bool HideTwoPoints { get; set; }
     
        public string Text
        {
            get { return this.InnerHtml; }
            set
            {
                if(HideTwoPoints)
                    this.InnerHtml = value;
                else
                    this.InnerHtml = value + ":";
            }
        }
     
        public MyLabel()
        {
        }
     
        public MyLabel(string tag) : base(tag)
        {
        }
    }

    With this you can use a more intelligent control within the RadFormDecorator without much trouble.

    Well, this is it. I hope this can help you out.

    Thanks dude!

    Cheers!

    Cezar
  10. Al
    Al avatar
    203 posts
    Member since:
    Oct 2006

    Posted 02 Dec 2014 Link to this post

    Hi,
    I understand from above that radFormDecorator won't style asp.labels, but what is the recommended solution?

    I am using a radSkinManager to dynamically change the style so I see two options:

    1. Use html labels rather than asp labels (not a good option because I already have many labels in place)
    2. Dynamically set the font of labels via css based on the style of the skin manager - but I don't know how to get the font of the current skin or how to set the lable font by css.

    Please help
  11. Al
    Al avatar
    203 posts
    Member since:
    Oct 2006

    Posted 02 Dec 2014 Link to this post

    Ok, after some tests I think I have found a solution. Asp:Labels render as spans UNLESS an AssociatedConrolID value is set, then they render as HTML labels, which are skinned by the radFormDecorator just fine!

    I'd still like to hear from anyone @Telerik as to what the recommended method is for styling labels...
  12. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1494 posts

    Posted 04 Dec 2014 Link to this post

    Hello Al,

    The RadFormDecorator styles HTML label elements and not span elements. More information is available in the Integration With Standard Controls help article.

    If you want, however, to style any HTML that is not styled by the RadFormDecorator you can use the decorator's classes in order to cascade through them. For example:

    CSS:
    01.<style>
    02.    html.RadForm.RadForm_Black span.decorateSpan {
    03.        color: white;
    04.        font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    05.        font-size: 12px;
    06.    }
    07. 
    08.    html.RadForm.RadForm_Metro span.decorateSpan {
    09.        color: #767676;
    10.        font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    11.        font-size: 12px;
    12.    }
    13.</style>
    ASPX:
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" Skin="Black" ShowChooser="true"></telerik:RadSkinManager>
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" />
        <asp:Label ID="Label1" Text="text1" runat="server" CssClass="decorateSpan" />
        <asp:Label ID="Label2" Text="text2" runat="server" AssociatedControlID="input1" />
        <input id="input1" runat="server" type="text" name="name" value=" " />
    </form>

    The above CSS styles the rendered span element by the asp label for the black and metro skins but you can also make the same for the rest of the skins.

    Regards,
    Danail Vasilev
    Telerik
     
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  13. Al
    Al avatar
    203 posts
    Member since:
    Oct 2006

    Posted 04 Dec 2014 in reply to Danail Vasilev Link to this post

    Thanks Danail, I think my method is easier though - just set AssociatedControlID on regular aps label & it all works ok.

    Is there perhaps something wrong with my approach?
  14. Al
    Al avatar
    203 posts
    Member since:
    Oct 2006

    Posted 04 Dec 2014 in reply to Danail Vasilev Link to this post

    Thanks Danail, my method seems easier though, just set AssociatedControlID on a regular asp label and it all works just fine.

    Is there perhaps a problem with my approach?
  15. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1494 posts

    Posted 05 Dec 2014 Link to this post

    Hi Al,

    This approach seems reasonable to me.

    Regards,
    Danail Vasilev
    Telerik
     
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  16. Jerry
    Jerry avatar
    2 posts
    Member since:
    Sep 2014

    Posted 03 Sep 2015 Link to this post

    As of the last two upgrades 2015.2.826 and 2015.2.729, the asp:Label is not using the current style of the RadDecorator. Previously as stated below, setting the AssociatedControlID would cause the label to get styled.  This no longer works.  Is anyone else seeing this?
  17. Jerry
    Jerry avatar
    2 posts
    Member since:
    Sep 2014

    Posted 03 Sep 2015 in reply to Jerry Link to this post

    Sorry, stated above.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017