When I was using the version 2010.2.825.235, I can use the line-height css style property to change the height of the DropDown List box. But once I have upgraded to verion 2010.3.1110.235, the line-height propery does not change the height of the DropDown List box.
This is the code for me to set the DropDown List style:-
.HtmlAttributes(
new { Style = "width: 200px; font-size: 20px; line-height: 40px; font-family: Arial, Helvetica, sans-serif;"})
Would you please tell me how to change the height of the DropDown List (without changing the font-size)?
12 Answers, 1 is accepted
I tried to reproduce the problem using the official of Q3 2010 to no avail. I am sending the test project. What is different in your case?
Note that I have commented this line in Site.css.
p, ul{ margin-bottom: 20px; /*line-height: 1.6em;*/}Sincerely yours,
Hristo Germanov
the Telerik team
Thanks for your reply.
From your example, I can see that you can change the height of each of the select items. But the part that I am talking about is the box which has an arrow on the side... or you can say the input text box of the Combo Box.
When I was using version 2010.2.825.235, I can use "HtmlAttributes" to change the height, font-size and so on for the dropdown list (the box part with an arrow).
Thank you for getting back to us.
1. Could you please modify the attached project with version 2010.2.825.235 and your case?
2. I want to note that by design If you have less then ten items scroll will not be appear.
Kind regards,
Hristo Germanov
the Telerik team
I have created two new projects. One is using version 2010.2.825.235 and the other is using version 2010.3.1110.235. Both will not display a scroll bar when the list does not contain more than 10 selection items.
Please check the attached screen shot which can show you the boxes in different version. I have marked them in red and as you can see the box from version 2010.2.825.235 has a bigger height even though I am adding the same code to the projects.
By the way, here is the same code that I have added to the projects.
<%= Html.Telerik().DropDownList()
.Name("DropDownList")
.Items(item =>
{
item.Add().Text("Item 1").Value("1");
item.Add().Text("Item 2").Value("2");
item.Add().Text("Item 3").Value("3");
item.Add().Text("Item 4").Value("4");
item.Add().Text("Item 5").Value("5");
item.Add().Text("Item 6").Value("6");
item.Add().Text("Item 7").Value("7");
item.Add().Text("Item 8").Value("8");
item.Add().Text("Item 9").Value("9");
item.Add().Text("Item 10").Value("10");
})
.HtmlAttributes(new { Style = "width: 200px; font-size: 20px; line-height: 40px; font-family: Arial, Helvetica, sans-serif;" })
%>
We have reproduced the problem and we work on it. We will follow up with a resolution after we investigate the problem, at the end of week.
We have a workaround for the problem:
You have to add this style
<style> .t-dropdown .t-input { line-height:inherit; }</style>before the DropDownList component.
Thank you for your feedback - your Telerik points have been updated.
All the best,
Hristo Germanov
the Telerik team
The problem has been fixed. Thank you again for the feedback.
Kind regards,
Alex Gyoshev
the Telerik team
Do you have any updated file with this fix?
Or will I have to wait for the next release?
The updated telerik.common.css is attached.
Kind regards,
Alex Gyoshev
the Telerik team
Would you please tell me will this fix be included in the future release? Or will I have to keep changing this file by muself?
The fix is included in all upcoming releases.
Greetings,
Alex Gyoshev
the Telerik team