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

input fields width is arbitrary set to 154px

5 Answers 419 Views
FormDecorator
This is a migrated thread and some comments may be shown as answers.
Didier
Top achievements
Rank 2
Didier asked on 16 Apr 2012, 11:19 PM

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

Sort by
0
Bozhidar
Telerik team
answered on 17 Apr 2012, 08:40 AM
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
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
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:
<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
Bozhidar
Telerik team
answered on 17 Apr 2012, 09:59 AM
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:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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
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" :-)
0
Bozhidar
Telerik team
answered on 18 Apr 2012, 07:11 AM
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
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.
Tags
FormDecorator
Asked by
Didier
Top achievements
Rank 2
Answers by
Bozhidar
Telerik team
Didier
Top achievements
Rank 2
Share this question
or