вопрос высоты div в т. е. div с фиксированной высотой в действительности не отображается одинаково в firefox и т. д. - PullRequest
0 голосов
/ 26 октября 2011

У меня есть одно окно поиска в моем приложении, которое имеет исходный HTML-код, как показано ниже:

<div class="nobg">
 <form id="search_form" onsubmit="return validateSearchForm();" action="">
     <table align="center">
        <tr>
          <td>
            <div class="searchDiv">
                <form id="search_form" onsubmit="return false;" action=""/>
                <input name="searchText" class="searchBox" id="searchText" style="font-style: italic;" onfocus="setSearchTextOnFocus(this)" onblur="setSearchTextOnBlur(this)" type="text" value="Affiliate Name"/>
                 <input name="search_options" id="search_options" type="hidden" value="affiliate_name"/>
                 <input name="search" class="searchButton" onclick="" type="submit"/>
                 <span id="icon_clear" jQuery1319611343728="17">x</span>
            </div>
          </td>
        </tr>
        <tr>
           <!--Search options -- Affiliate Name|Site Id|Site Name...-->
        </tr>
     </table>
   </form>
 </div>

Теперь в Firefox / Chrome окно поиска отображается так, как показано на рисунке:

enter image description here

, тогда как в IE он отображается как:

enter image description here

Когда я проверил в инструментах разработчика IE, я обнаружил, что это вызваноАтрибут высоты searchDiv

связанный css:

.searchDiv {
PADDING-BOTTOM: 0px;
PADDING-LEFT: 0px;
WIDTH: 450px;
PADDING-RIGHT: 0px;
FLOAT: left;
HEIGHT: 25px;
PADDING-TOP: 0px
}

Этот div внутри td создает дополнительный пробел.Если я удаляю атрибут высоты, searchDiv сворачивается в окне поиска, и это происходит в Firefox / Chrome.

Должна быть некоторая проблема с рендерингом для фиксированных высот внутри div вIEКак я могу преодолеть это?

...