Changing Tile Title Styling from Code Behind

4 posts, 0 answers
  1. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 29 Sep Link to this post

    I have a RadContentTemplateTile with a default Title colour of Black set via

    .rtileTitle
        {
             color: Black !important;
        }

    Sometimes I have the need to change the Black to Red and I'd like to do it via CSS as below.

    .rtileTitleRed
        {
            color: Red !important;
         }

     

    The trouble is, I don't know how/where to apply this CSS in code behind. Please assist.

  2. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 30 Sep Link to this post

    Hello Silviu,

    You can set only CSS class names in code behind by the CssClass property and after that apply the mentioned styles regularly in your CSS file.

    Regards,
    Magdalena
    Telerik by Progress
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 30 Sep in reply to Magdalena Link to this post

    Hi Magdalena,

    I have tried that already by setting the tile's CssClass but the changes were not applied. Could not see them applied when debugging IE with F12 either.

    RadContentTemplateTile tile = myControl.FindControl("radTile") as RadContentTemplateTile;
    tile.CssClass = "rtileTitleRed";

  5. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 30 Sep Link to this post

    Hello Silviu,

    Here is an example that works, with explanations:

    /*you need a selector heavier than the built-in in order to override the rule*/
    html div.RadTile.customTitleColor h6.rtileTitle
    {
        color: green;
    }
     
    /*you need to incorporate the new class in the current selector, you cannot just append the color to the selector*/
    html div.RadTile.customTitleColor.redTitle h6.rtileTitle
    {
        color: red;
    }

    <telerik:RadContentTemplateTile runat="server" ID="RadContentTemplateTile1" Title-Text="click for red" CssClass="customTitleColor" OnClick="RadContentTemplateTile1_Click" AutoPostBack="true">
    </telerik:RadContentTemplateTile>

    protected void RadContentTemplateTile1_Click(object sender, EventArgs e)
    {
        RadContentTemplateTile1.CssClass="customTitleColor redTitle";
    }

    You may also find useful some tutorials in the Internet on CSS selectors and their specificity, like these ones:


    Regards,

    Marin Bratanov
    Telerik by Progress
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top