This is a migrated thread and some comments may be shown as answers.

RadGrid custom skin not overwriting combobox in pager

5 Answers 98 Views
Grid
This is a migrated thread and some comments may be shown as answers.
mk
Top achievements
Rank 1
mk asked on 09 Mar 2010, 12:07 AM
I have added a custom skin to the RadGrid. I have made all the modifications to the Grid.CustomSkin.css file and my grid looks good. I am working on changing the combobox in the Pager. I am modifying ComboBox.CustomSkin.css but not all of my changes are working. I used the IE Developer toolbar and noticed that it is still pulling the css from Telerik.Web.UI.WebResource.axd. How do I prevent it from doing that?

5 Answers, 1 is accepted

Sort by
0
Accepted
Dimo
Telerik team
answered on 09 Mar 2010, 10:05 AM
Hello mk,

RadComboBox uses a base stylesheet, which contains some styles, which normally should not be changed. If you need to override some of the base styles, you simply have to use a higher specificity for your custom skin styles. For example:

base CSS

.RadComboBox table td.rcbInputCell
{
    width: 100%;
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
    padding: 0;
    border: 0;
}


your custom CSS

div.RadComboBox  table  tr  td.rcbInputCell
{
    height: 21px;
    line-height: 21px;
}


More information about CSS specificity is available at:

http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx


Best wishes,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
JH
Top achievements
Rank 1
answered on 29 Mar 2010, 02:52 PM
Hi,

I have the exact same problem.
I need to change the pager's combobox's z-index to a higher value.
Lets say that my custom RadGrid skin is called "SkinName". What syntax is then necessary in order to set the comobox's z-index?

BR
0
Dimo
Telerik team
answered on 30 Mar 2010, 07:49 AM
Hello JH,

One option is to use CSS:

.rcbSlide
{
        z-index: ....... ;
}


Another option (recommended) is to obtain a reference to the RadComboBox (the ID is PageSizeComboBox) and set its ZIndex property at runtime. Here is how to obtain the reference:

http://www.telerik.com/community/forums/aspnet-ajax/grid/how-to-remove-quot-page-size-quot-dropdown.aspx

Kind regards,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
JH
Top achievements
Rank 1
answered on 30 Mar 2010, 08:06 AM
Hi,

Thank you for the quick answer.
CSS is favorable for me, but I did not succeed using your suggestion.

I have tried both these approaches in my Grid.MySkin.css.

.rcbSlide

{

 

z-index:10000000 !important;

 

}

.RadGrid_MySkin

 

.rcbSlide

 

{

 

z-index:10000000 !important;

 

}

What's wrong?

0
Dimo
Telerik team
answered on 30 Mar 2010, 01:57 PM
Hi JH,

The second CSS rule will not work, because rcbSlide is outside RadGrid. However, the first should work. Please make sure that the stacking contexts are OK.

http://blogs.telerik.com/atanaskorchev/posts/09-07-02/z-index_demystified.aspx

If you need further assistance, please send us a runnable demo.

All the best,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
Grid
Asked by
mk
Top achievements
Rank 1
Answers by
Dimo
Telerik team
JH
Top achievements
Rank 1
Share this question
or