CSS - Как заставить IE7 уважать минимальную ширину

IE7 игнорирует мою настройку минимальной ширины. Я читал, что IE7 поддерживает минимальную ширину, пока вы находитесь в режиме стандартов (а не причудах). Я указал

<!DOCTYPE html>

как мой заголовок. Разметка действительна. Я все еще не могу заставить IE7 уважать min-width. Что мне делать?

Sample Code

     <table class="ProcedureTable">
        <thead>
            <tr>
                <th>column data</th>
                <th>column data</th>        
                <th>column data</th>
                <th>column data</th>
                <th>column data</th>
            </tr>
        </thead>
                    <tr class="PadColumns">
                        <td class="ExpandName">
                            column data
                        </td>

CSS

.ExpandName
{
    min-width:25em;
}

Ответ 1

Ах Да.. Я наткнулся на это некоторое время назад

проверить эту ссылку

http://blog.throbs.net/2006/11/17/IE7+And+MinWidth+.aspx

По существу... вам нужно включить эту прокладку в JS, чтобы вручную взломать правило

Ниже приводится способ, которым я обрабатываю его

Просто вызовите функцию onload тела

    /*
author: Rob Eberhardt
desc: fix MinWidth for IE6 & IE7
params: none
returns: nothing
notes: cannot yet fix childless elements like INPUT or SELECT
history:
   2006-11-20 revised for standards-mode compatibility
   2006-11-17 first version
*/
function fixMinWidthForIE(){
   try{
      if(!document.body.currentStyle){return} //IE only
   }catch(e){return}
   var elems=document.getElementsByTagName("*");
   for(e=0; e<elems.length; e++){
      var eCurStyle = elems[e].currentStyle;
      var l_minWidth = (eCurStyle.minWidth) ? eCurStyle.minWidth : eCurStyle.getAttribute("min-width"); //IE7 : IE6
      if(l_minWidth && l_minWidth != 'auto'){
         var shim = document.createElement("DIV");
         shim.style.cssText = 'margin:0 !important; padding:0 !important; border:0 !important; line-height:0 !important; height:0 !important; BACKGROUND:RED;';
         shim.style.width = l_minWidth;
         shim.appendChild(document.createElement("&nbsp;"));
         if(elems[e].canHaveChildren){
            elems[e].appendChild(shim);
         }else{
            //??
         }
      }
   }
}

есть и другой способ сделать это

http://perishablepress.com/press/2007/01/16/maximum-and-minimum-height-and-width-in-internet-explorer/

    * html div#division { 
   height: expression( this.scrollHeight < 334 ? "333px" : "auto" ); /* sets min-height for IE */
}

Ответ 2

Я новичок, поэтому, по-видимому, я не могу комментировать первый ответ @samccone выше. Просто хотел добавить, что он работает, но будет генерировать ошибки в IE9, как он создает нераспадающийся элемент пространства, т.е....

shim.appendChild(document.createElement("&nbsp;"));

Эта строка может быть заменена на...

shim.innerHTML = "&nbsp;";

и все хорошо. Надеюсь, это поможет кому-то.

Ответ 3

Разметка действительна.

Нет, <!DOCTYPE html> недействителен в той эпохе. Насколько мне известно, это стало действительным только с HTML5, о котором IE7, разумеется, не знает (IE9 в некоторой степени осведомлен, не уверен в 8). На странице, над которой я работаю, min-width отлично работает даже в теге body. Однако мы используем XHTML на этой конкретной странице:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Кроме того, другие вещи могут вывести IE из стандартного режима и привести его в режим quirks, поэтому даже правильный doctype может не исправить его для вас. Итак, если вы должны использовать HTML5 и быть совместимы с IE7, вам придется прибегнуть к атрибуту behaviour CSS, условному комментарию и/или специфическим для IE7 script.