in Telerik.Web.UI_2012_1_411_Dev input fields width is now arbitrary set to 154px:
.RadForm.rfdTextbox input[type="text"], .RadForm.rfdTextbox input[type="password"], .RadForm.rfdTextbox input[type="search"], .RadForm.rfdTextbox input[type="url"], .RadForm.rfdTextbox input[type="tel"], .RadForm.rfdTextbox input[type="email"] (ligne 1)
{
width: 154px;
padding-top: 2px;
padding-right: 2px;
padding-bottom: 3px;
padding-left: 2px;
height: auto;
line-height: normal;
}
Is there some good reason for that?
Thanks :-)
5 Answers, 1 is accepted
0
Hello,
From Q3 2011 all input elements default width is set to 160px as it was mentioned in the release notes as a breaking change. Now if you place an HTML input or asp textbox, or another Telerik input control without specifying explicitly the width, it will be rendered to 160px as the mentioned from you: 154px width + 2px left padding + 2px right padding + 1px left border + 1px right border = 160px width.
This will allow you to have unified look and feel in all browsers while using different input Telerik controls.
Greetings,
Bozhidar
the Telerik team
From Q3 2011 all input elements default width is set to 160px as it was mentioned in the release notes as a breaking change. Now if you place an HTML input or asp textbox, or another Telerik input control without specifying explicitly the width, it will be rendered to 160px as the mentioned from you: 154px width + 2px left padding + 2px right padding + 1px left border + 1px right border = 160px width.
This will allow you to have unified look and feel in all browsers while using different input Telerik controls.
Greetings,
Bozhidar
the Telerik team
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
Didier
Top achievements
Rank 2
Rank 2
answered on 17 Apr 2012, 09:13 AM
Previously we were using Telerik.Web.UI_2011_3_1305_Dev and "our" fields were at the precise width we had decided (using size="nn"), for example:
With the new release (Telerik.Web.UI_2012_1_411_Dev) they are all "short": size="nn" has no more effect.
Telerik previous styles (Telerik.Web.UI_2011_3_1305_Dev, the last Q3 2011) were :
<input name="ctl00$ContentPlaceHolder1$ContactFirstNameF" type="text" size="48" id="ctl00_ContentPlaceHolder1_ContactFirstNameF" />With the new release (Telerik.Web.UI_2012_1_411_Dev) they are all "short": size="nn" has no more effect.
Telerik previous styles (Telerik.Web.UI_2011_3_1305_Dev, the last Q3 2011) were :
.RadForm.rfdTextbox input[type="text"], .RadForm.rfdTextbox input[type="password"] (ligne 98)
{
padding-top: 2px;
padding-right: 2px;
padding-bottom: 3px;
padding-left: 2px;
height: auto;
line-height: normal;
}
Should we code style="width:nnnpx;' for each input field rather than size="nn"??? Or is there any bug relative to size??
Thanks for your help.
0
Hi,
You should use style for inputs, or to create CSS class if you have a lot of inputs with equal size, or if you use asp text box, you could use the width property:
The first and third will be 50px, the second will be the default 160px;
The size property is not related with the layout, so it should not be used to specify width. It is related with the visible symbols in the input, and depending on the chosen font family it could be really different, while 50px are always 50px.
Greetings,
Bozhidar
the Telerik team
You should use style for inputs, or to create CSS class if you have a lot of inputs with equal size, or if you use asp text box, you could use the width property:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <style type="text/css"> </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <telerik:RadFormDecorator ID="rfd1" runat="server" DecoratedControls="All" Skin="Sunset" /> <input type="text" style="width: 50px;" /><br /> <br /> <input type="text" size="50" /><br /> <br /> <asp:TextBox runat="server" Width="50"></asp:TextBox> </form></body></html>The first and third will be 50px, the second will be the default 160px;
The size property is not related with the layout, so it should not be used to specify width. It is related with the visible symbols in the input, and depending on the chosen font family it could be really different, while 50px are always 50px.
Greetings,
Bozhidar
the Telerik team
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
Didier
Top achievements
Rank 2
Rank 2
answered on 17 Apr 2012, 12:59 PM
Hi,
So we changed our "framework" so that it sets Width as a percentage (ie Width % = 90 / columns * 64). It does the trick.
The global aspect of "decorated forms" is better with the new styles "2012 Q1" :-)
So we changed our "framework" so that it sets Width as a percentage (ie Width % = 90 / columns * 64). It does the trick.
The global aspect of "decorated forms" is better with the new styles "2012 Q1" :-)
0
Hi,
Yes, as mentioned in my previous post, for asp textboxes you could use both width or style, for HTML text inputs you should use style, and for both asp and HTML you could set a specific class. When using style you could set the width i pixels, em, pt etc. Using width property you could use pixels and percentages.
In previous versions, as IE6, 7, 8 does not support rounded corners we are using additional HTML elements to simulate it, because of these additional HTML elements if you set the width to 100px it would be 100 in modern browsers, but more in IE6-IE8 - about 108px.
Now with the unification fix, the problem is solved.
All the best,
Bozhidar
the Telerik team
Yes, as mentioned in my previous post, for asp textboxes you could use both width or style, for HTML text inputs you should use style, and for both asp and HTML you could set a specific class. When using style you could set the width i pixels, em, pt etc. Using width property you could use pixels and percentages.
In previous versions, as IE6, 7, 8 does not support rounded corners we are using additional HTML elements to simulate it, because of these additional HTML elements if you set the width to 100px it would be 100 in modern browsers, but more in IE6-IE8 - about 108px.
Now with the unification fix, the problem is solved.
All the best,
Bozhidar
the Telerik team
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.