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

RadComboBox height and bg image incorrect in IE 8 Standards Mode

1 Answer 96 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Steve
Top achievements
Rank 1
Steve asked on 07 Nov 2012, 03:27 PM
RadComboBox is not rendering correctly in IE 8 Standards mode, though it looks fine in IE 7 Standards Mode and in IE 9.

When rendered, the combo box is followed by a second, visible "rcbFakeInput" input also created by Telerik that causes the combo box container height to stretch, allowing more of the combo box background image sprite to be visible than should be. The result is a combo box with an undesirable, extra row of strange graphics beneath it (see attached screenshot).

<telerik:RadComboBox ID="rcbExistingRoles" runat="server"> produces the HTML/CSS below. Note the second <input> tag with class="rcbFakeInput".

Using the IE developer tools, the problem goes away if I specify a class that sets the display of the "rcbFakeInput" to none. However, I'm not sure of the purpose of this fake input and would have to hide it in numerous places in the app we are developing.

  

<div class="RadComboBox RadComboBox_Vista" id="rcbExistingRoles" style="width: 160px; position: relative;" _events="[object Object]" control="[object Object]" value="">
<table class="rcbDisabled" style="width: 100%; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-collapse: collapse; table-layout: fixed;" summary="combobox">
<tbody>
<tr class="rcbReadOnly">
<td class="rcbInputCell rcbInputCellLeft" style="width: 100%; margin-top: -1px; margin-bottom: -1px;">
<input name="rcbExistingRoles" disabled="" class="rcbInput radPreventDecorate" id="rcbExistingRoles_Input" style="display: block;" type="text" readOnly="" _events="[object Object]" autocomplete="off" jQuery17206440974672821855="2"/>
<input tabIndex="-1" class="rcbFakeInput" style="left: 5px; top: 2px; width: 133px; height: 18px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; position: absolute; z-index: 1; background-color: transparent;"/>

1 Answer, 1 is accepted

Sort by
0
Ivan Zhekov
Telerik team
answered on 09 Nov 2012, 05:46 PM
Hello, Steve.

Could you provide more information to how this is happening e.g.:
-- Does it always happen, say on initial page load?
-- Does it always happen, say after postback?
-- Are the ComboBoxes placed inside an ajax panel / window?
-- Do you have a rad form decorator on the page?

All that information will be valuable to resolving this case.

I should also note that we recently had a similar case and we are working on a fix for it. I am pretty sure both cases are related if not the same.

Greetings,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
ComboBox
Asked by
Steve
Top achievements
Rank 1
Answers by
Ivan Zhekov
Telerik team
Share this question
or