How to change the default Hover border color for specific tile

3 posts, 0 answers
  1. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 02 Dec 2014 Link to this post

    How to change the default Hover border color for specific tile?

    In this example, let's say we wanted the red tile to have a red border.


    Is there a simple way to do this with the control?

    Setting the BorderColor property on the tile shows the border always with no hover effect.

    Thanks,
    Todd.

  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 03 Dec 2014 Link to this post

    Hello Todd,

    The border on the selected tiles comes via CSS rules and a class, and you can override it like that:

    div.RadTile.rtileSelected,
    div.RadTile.rtileSelected.rtileHovered
    {
        border-color: red;
    }

    which would affect all tiles on the page. You can then make this more specific in a number of ways, for example, by using the CssClass property of the tile, or a skin-specific selector.

    Here is a concrete example:

    div.RadTile.rtileSelected.redSelection,
    div.RadTile.rtileSelected.rtileHovered.redSelection
    {
        border-color: red;
    }

    <telerik:RadTextTile runat="server" ID="one" Text="lorem" EnableSelection="true" Selected="true"></telerik:RadTextTile>
    <telerik:RadTextTile runat="server" ID="two" Text="ipsum" EnableSelection="true" Selected="true" CssClass="redSelection"></telerik:RadTextTile>


    Regards,

    Marin Bratanov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 04 Dec 2014 in reply to Marin Bratanov Link to this post

    Great.  I will give it a try!
Back to Top