This is a migrated thread and some comments may be shown as answers.
Border
1 Answer 9 Views
This is a migrated thread and some comments may be shown as answers.
Kjell
Top achievements
Rank 1
Kjell asked on 18 Dec 2020, 06:24 PM

How remove bottom border in Material skin? Or set all borders in RadDropDownTree using Material skin?

And how set RadDropDownTree Height (the combobox...)?

1 Answer, 1 is accepted

Sort by
0
Doncho
Telerik team
answered on 23 Dec 2020, 07:00 AM

Hello,

In general, Telerik Controls render HTML structures and apply some built-in stylesheets to achieve a certain appearance. If you would like to further customize that appearance, you will need to override the built-in styles. 

To do that, apply 'strong' enough selectors to override the built-in ones. Check out the following articles for more information:

For instance here is a sample CSS targeting RadDropDownTree in Material Skin. Setting the height of the dropdown element and removing its bottom border:

.RadDropDownTree.RadDropDownTree_Material .rddtInner{
    height:100px;
}
.RadDropDownTree.RadDropDownTree_Material .rddtInner:before{
    border-bottom:none;
}

To sum up, every style can be overridden, if you know what you want to style. For tips and tricks in finding that, you can take a look at the suggestions in the first two points of the Improve Your Debugging Skills with Chrome DevTools blog post explaining how to inspect the generated HTML and check the applied styles for various elements. 

To learn more about CSS styling and using the Browser's developer tools, you may find the following videos useful: 

I hope this will help.

Kind regards,
Doncho
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Asked by
Kjell
Top achievements
Rank 1
Answers by
Doncho
Telerik team
Share this question
or