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

Formatting with other styled controls

1 Answer 90 Views

AutoCompleteBox

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

Alex asked on 26 Jul 2017, 03:41 AM

capture.jpg

I am trying to have the AutoCompleteBox fit in with the other controls on my form. Note that the textbox is not style similarly to the other textboxes. Is there some technique to obtain consistency?

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Skin="Web20" />

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />

<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox><br />

<telerik:RadAutoCompleteBox ID="RadAutoCompleteBox1" runat="server" Skin="Web20"></telerik:RadAutoCompleteBox><br />

<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox><br />

<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>

The screenshot attached show first without the RadDecorator and then with (note that it does not make it better.

1 Answer, 1 is accepted

answered on 28 Jul 2017, 01:05 PM

Hello,

You can make the corners of RadAutoCompleteBox rounded with the help of highlighted CSS below:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style>

.RadAutoCompleteBox .racTokenList {

border-radius: 5px;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager runat="server" />

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" Skin="Web20" RenderMode="Lightweight" />

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />

<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox><br />

<telerik:RadAutoCompleteBox ID="RadAutoCompleteBox1" runat="server" Skin="Web20" RenderMode="Lightweight"></telerik:RadAutoCompleteBox>

<br />

<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox><br />

<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>

</form>

</body>

</html>

Kind regards,
Rumen
Progress Telerik

Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.