Firstly am very fresh to this components. I already used css to lay asp:labels and asp:textboxes etc ..even grid control and calender cntrls in asp.
We need UI help to design a big project which have lot of labels and its Associated Input fields to lay ...2 column ..3 column upto 4
So how we have to write our CSS.

I just go thru the a page which is fully filled with telerick controls. And i found we cant change their color or margins or paddings thru CSS. Only we can control its width from an external CSS file. Also dropdowns are rendering inside a table so i cant control its width with SELECT tag.

Also i found that in grid if column increase width also increase will break layout ..Pls help me am attaching a sample page in our present ASP application
Thanks in Adv
 
UI Designer

Too bad no responds from telerik

Hi Vargis,

You can add margin to the wrapper of the RadInput Control with the following CSS rule

Also, the padding should be set on the input element, e.g.

Additional, please refer to the following styling demo and blog post
http://demos.telerik.com/aspnet-ajax/input/examples/appearance/styles/defaultcs.aspx

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

I hope this helps.

All the best,
Galin
the Telerik team

Thanks Galin
We are going to buy this controls but your team support is too slow.

Your  answer is not at all

Please see our CSS structure


/* To divide a page into 2 column */

.div2col-S,.div2col-M,.div2col-L, .div2col-bothlbl {width:47.5%;margin:0 0 0 1.5%;}

/* To Align Label and other input fields
In .div2col-S Label width occupies 20%
In .div2col-S Label width occupies 30%
In .div2col-S Label width occupies 40%
*/

.div2col-S span, .div2col-S label {float:left; width:20%}
.div2col-S input[type=text], .div2col-L textarea {float:left; width:72%}
.div2col-S select {float:left; width:73%}


.div2col-M span, .div2col-M label, .div2col-M a {float:left; width:30%}
.div2col-M input[type=text], .div2col-M textarea{float:left; width:60%}
.div2col-M select {float:left; width:61%}


.div2col-L span, .div2col-L label {float:left; width:40%}
.div2col-L input[type=text], .div2col-L textarea {float:left; width:52%}
.div2col-L select {float:left; width:53%}

So we dont hav to put width on every element. Becoz of putting dimensions in Percentage(%) instead of Pixels(px) elements wil adj according to screen size it will increase or decrease

Hello Vargis,


Greetings,
Galin
the Telerik team

Thanks for your reply.
Now I had achieved wat i want to do. Percentage is worked .Also no need to call a css class on every telerik field/control.
Its all from an external css globally.