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

Css Style Autocomplete

1 Answer 209 Views
AutoCompleteBox
This is a migrated thread and some comments may be shown as answers.
Kevin
Top achievements
Rank 1
Kevin asked on 06 Feb 2015, 04:14 PM
never run itto something more frustrating on telerik controls.  I have a linkbutton right after my RadAutoComplete box, but it always wants to move it under the autocomplete box, no matter if I have in table, div whatever.  I inline-Block works somewhat to get the link button to be on same line as autocomplete box but then it will not center in the div, no matter.  used many differenet display types but it always messes up the autocompete box or moves the linkbutton to next line.  Just a frustrating experience that you cannot override the css on a autocomplete box or that it does this in first place.

This method get it centered on div, but not matter how I try to get the link button to line up with the autocomplete box its messes it up.

.alignSearcher{
    margin:0 auto;
}
 
 
 <div class="table100">
            <h3 style="text-align:center">Add Personnel or Change Time</h3>
            <telerik:RadAutoCompleteBox ID="txtName" runat="server" Width="280px" CssClass="alignSearcher" OnClientRequesting="requesting" DropDownPosition="Automatic" DropDownWidth="270px" AllowCustomEntry="true" EmptyMessage="Enter Last Name First Name to Search"  InputType="Text"
                    HighlightFirstMatch="true" TextSettings-SelectionMode="Single" IsCaseSensitive="false" >
                    <WebServiceSettings Path="../AutoComplete.asmx" Method="GetSrp" />
            </telerik:RadAutoCompleteBox>  <asp:LinkButton ID="lnkSearch" runat="server" CausesValidation="false" Text="Add Personnel"></asp:LinkButton>
        </div>

1 Answer, 1 is accepted

Sort by
0
Accepted
Magdalena
Telerik team
answered on 09 Feb 2015, 09:08 AM
Hi Kevin,

Thank you for getting back to Telerik support.

Please, apply the following CSS to make the link button is next to the RadAutocompleteBox and to be centered in the .table100 element.
.table100 {
    text-align: center;
}
 
.RadAutoCompleteBox ,
#lnkSearch {
    display: inline-block;
    vertical-align: middle;
}

We are also sending you a sample project in the attachment.

Do not hesitate to contact us if you have other questions.

Regards,
Magdalena
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
AutoCompleteBox
Asked by
Kevin
Top achievements
Rank 1
Answers by
Magdalena
Telerik team
Share this question
or