Минимальная ширина CSS в IE6, 7 и 8
Я нашел много ответов на этот вопрос в Google, но ни один из них, похоже, не работает для всех браузеров.
Я ищу способ только для CSS, чтобы получить минимальную ширину, работающую над Firefox, IE6, IE7 и IE8. Хорошо известно, что IE не поддерживает минимальную ширину, поэтому есть несколько хаков, чтобы попытаться эмулировать поведение min-width. К сожалению, мне не повезло с ними.
В частности, это то, что я пытаюсь сделать:
<style type="text/css">
table.dataTable td {
white-space: nowrap;
}
table.dataTable td.largeCell {
white-space: normal;
min-width: 300px;
}
</style>
<table class="dataTable">
<tr>
<td>ID</td>
<td>Date</td>
<td>Title</td>
<td class="largeCell">A large amount of data like a description that could
span several lines within this cell.</td>
<td>Link</td>
</tr>
</table>
Есть ли у кого-нибудь способ заставить это работать?
Ответы
Ответ 1
Итак, оказывается, что необходимый хак для получения минимальной ширины для работы во всех браузерах не так уродлив, как многие из них делают.
Мне нужно было только добавить CSS для div в largeCell
и добавить пустой div в конец ячейки. Div только 1px высотой, поэтому на самом деле это не делает ячейку больше, чем она должна быть.
<style type="text/css">
table.dataTable td {
white-space: nowrap;
}
table.dataTable td.largeCell {
white-space: normal;
min-width: 300px;
}
table.dataTable td.largeCell div {
margin: 0px 0px 0px 0px;
height: 1px;
width: 300px;
}
</style>
<table class="dataTable">
<tr>
<td>ID</td>
<td>Date</td>
<td>Title</td>
<td class="largeCell">A large amount of data like a description that could
span several lines within this cell.
<div></div>
</td>
<td>Link</td>
</tr>
</table>
Ответ 2
Я использую:
min-width: 200px;
_width: 200px; /* IE6 */
Ответ 3
min-height:expression( document.body.clientHeight +'px');
min-width:expression( document.body.clientWidth +'px');
Ответ 4
По умолчанию режим документа в IE будет режимом Quirks
Решение:
добавьте doctype поверх страницы html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Ответ 5
После стольких взломов, которые я пробовал, ни один из них не работает для меня для этой проблемы с минимальной шириной, но, наконец, я получил свое решение для IE 8.
Попробуйте использовать это: <!DOCTYPE html>
как тип DOC, это тип HTML 5 DOC, который превращает вашу страницу IE8 в поведение как браузер Mozilla или Webkit.
Таким образом, для минимальной и минимальной высоты проблема очень облегчает многие проблемы IE8.
Если мой пост поможет вам отправить мне письмо с вашим именем, оно работает для вас.
Ответ 6
Попробуйте добавить:
overflow: visible
к элементу
Ответ 7
У меня была аналогичная проблема, мне нужен сайт, чтобы он составлял 95%, если он был меньше 980px.
Ничего здесь не работало, и в отчаянии я обратился к ответу Билла Берлингтона. Один из упомянутых выше не работал у меня, но если бы я использовал более надежное выражение, это сделало!
width: expression ( document.body.clientWidth < 980 ? "980px" : "95%" );
В основном это означает, что если ширина меньше 980 пикселей, установите ширину 980px. Если он шире, установите ширину 95%.
Ответ 8
<style type="text/css">
.table1 th a {
display:inline-block;
width:200px";
}
</style>
<table>
<tr>
<th><a>title1</a></th>
<th><a>title2</a></th>
</tr>
<tr>
<td>text</td>
<td>text</td>
</tr>
</table>