The token container of RadAutoCompleteBox is a Div element which does not have a specified height therefore when the specified width of the control is reached the tokens are moved to the next line. You may specify certain height of the Div element but the input element in which the user is allowed to type will still move to the next line when the end (width) of the control is reached. It is just that the control is not designed to be customized like that.
Hope this information will helps you.
Thanks,
Shinu.
0
Nencho
Telerik team
answered on 15 May 2014, 01:15 PM
Hello Arge,
Indeed, as Shinu mentioned, the control is not designed to work in such a manner. If it is not expanded on the second row, once the tokens list became too large - the input will not be visible. In this case, when the user is unable to locate the area to add new entries, this makes this behavior not quite user-friendly. However, you could restrict the second row expand by the following style rules:
<style type="text/css">
html .RadAutoCompleteBox .racTokenList {
white-space: nowrap;
}
html .RadAutoCompleteBox .racToken,
html .RadAutoCompleteBox .racInput {
float: none;
display: inline-block;
}
</style>
Regards,
Nencho
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.