Internet Explorer игнорирует отображение: встроенный - PullRequest
Новая
       3

Internet Explorer игнорирует отображение: встроенный

0 голосов
/ 27 июля 2011

У меня есть некоторая HTML-разметка, созданная Sharepoint, которая не самая лучшая, которую вы видели, и не может вмешиваться в разметку, но должна стилизовать ее с помощью CSS.

Разметка выглядит примерно так: 

<div id="searchbox">
<table>
<tr>
<td>
<table class="mstable">
<tr>
<td><input></input></td>
<td><select><option></option><option></option></select></td>
</tr>
</table>
</table>
<div id="fontsize">
<a href=""/>
<a href=""/>
</div>
</div>

Вот CSS-код 

#searchbox {
    float: right;
    margin-right: 15px;
    margin-top: 10px;
    text-align: right;
    width: 40%;
}

#fontsize {
    float: right;
    width: 46px;
}

.mstable {
    border-collapse: collapse;
    margin-left: 2px;
    margin-top: 2px;
    width: 100%;
    color: #000000;
    font-family: Verdana;
    font-size: 0.7em;
    font-style: normal;
    font-weight: normal;
}

То, что я пытаюсь сделать, это поместить div размера шрифта рядом со столом. В настоящее время после таблицы происходит перерыв, и идентификатор fontsize идет под ним. here's how it looks

Я установил display: inline для всех потомков таблицы searchbox и div fontsize, и в Firefox я получаю желаемый результат, но в IE (все версии 8 и ниже) он игнорирует его.

Я знаю, что моим решением было бы удалить эти таблицы и сделать их только для div, но я не знаю, есть ли у меня такая возможность ..

Редактировать: я решил проблему, установив float: left для таблицы и размер шрифта div И установив ширину в пикселях для самой таблицы, чтобы ограничить ее расширение на весь раздел searchbox.

Ответы [ 2 ]

1 голос
/ 27 июля 2011

Это должно сделать это для вас:

http://jsfiddle.net/nULYR/8/

работает в ie7 +

EDIT 

<table>
<tr>    // here is 
<td>    // the problem
<table class="mstable">
<tr>
<td><input></input></td>
<td><select><option></option><option></option></select></td>
</tr>
</table>
</table>

С: http://jsfiddle.net/nULYR/13/

Без: http://jsfiddle.net/nULYR/12/

1 голос
/ 27 июля 2011

попытайтесь переместиться влево от таблицы, которая идет сразу после div 'searchbox': 

<div id="searchbox">
<table style="float: left;">
...