[Solved] CSS/Skin for controls in RadGrid

[Sam]

Hi,

I upgraded one page in my app to the newest RadGrid and I see that textboxes in the RadGrid are now skinned to match the RadGrid skin.

Is there a way to keep the RadGrid skin, but disable the skinning of textboxes?
I have a CSS style for all textboxes through out the app, so on this one page with the new RadGrid, even though I have my CssClass attribute set on the textboxes in the RadGrid, they're getting overidden by the RadGrid style.

Thanks!
Sam

[Dimo]

Hello Sam Tran,

Could you please specify which textboxes do you mean, so that we can give a more-to-the point advice?

- filter row textboxes
- paging textboxes
- edit form textboxes

Thank you in advance.


Best wishes,
Dimo
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Shinu]

Hi,

Go through the following help article and see hoe the FilterTextBox is accessed.
Setting filter textbox dimensions/changing default filter image

Shinu.

[Sam]

Dimo,

My issues is with the textboxes inside the <FormTemplate>
Inside the FormTemplate, I have a table with a bunch of textboxes and below that, another RadGrid (also inside the FormTemplate).

I just basically want it to work like the old RadGrid, keep the teleik themes for the Grid elements, but not skin the textboxes.

Shinu,
I don't need to programatically access the textbox properties as in the link you posted.  I can still set width and other properties of the textbox in the textbox tag:

<

asp:TextBox ID="TxtComments" runat="server" CssClass="CssTextBoxSuperSmall" Height="45px" TabIndex="0" Text='<%# Eval("Comments") %>' TextMode="MultiLine" Width="600px">

The above works fine except for the CssClass attribute; that gets overridden by the telerik skin.

[Dimo]

Hello Sam,

The CSS rule which is located in the RadGrid skin and overrides your EditForm textbox styles looks like this:

.GridEditForm_SKIN input[type="text"],

.GridEditForm_SKIN textarea

{

border:.......;

font:......;

color:.....;

}

So you have a couple of options:

1) If you are using a non-embedded (custom) skin, simply remove the above CSS rule.

2) If you are using an embedded skin, then use the following CSS rule to override the one in the embedded skin:

.GridEditForm_SKIN  .CssTextBoxSuperSmall[type="text"]

{

border:.......;

font:......;

color:.....;

}

You can combine your current CSS rule and the new one, so the result will be something like this:

.CssTextBoxSuperSmall,

.GridEditForm_SKIN  .CssTextBoxSuperSmall[type="text"]

{

border:.......;

font:......;

color:.....;

}

Let us know if everything is OK now.


Greetings,
Dimo
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center