Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Опять IE6 или элементы не помещаются (хотя должны)

Автор: tequilla4white 20.9.2007, 10:52

Имеем простую разметку:

Код


<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
    <div id = "page">
        <div id = "leftSide" style="width:230px; background-color:#99CC00; float:left;">
            sad
        </div>
        <div id = "main" style="margin-left:230px; background-color:#CCCCCC;">
            <table border="0" cellpadding="0" cellspacing="0" style="width:100%; height:107px; background-color:#00CCFF;">
                <tr>
                    <td>sad</td>
                    <td style="width:180px; background-color:#33CC33">asd</td>
                    <td style="width:252px; background-color:#FF3300">asda</td>
                </tr>
            </table>
            asdasd
        </div>
    </div>
</body>
</html>

В Огнелисе, Опере и даже IE7 работает отлично, но в IE6 таблица (да и любой другой блочный элемент) если ей указать width:100% не помещается, и опускается пока не закончится содержание div`a c id = "leftSide"...

Помогите, уже не знаю как и быть...

Автор: kizune 20.9.2007, 11:33

наверное так

Код


<!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"  style="margin:0; padding:0; width:100%; height:100%;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body style="margin:0; padding:0; width:100%; height:100%;">
    <div id = "page">
        <div id = "leftSide" style="width:230px; background-color:#99CC00; float:left;">
            sad
        </div>
        <div id = "main" style=" background-color:#CCCCCC; vertical-align:top; float:left;">
            <table border="0" cellpadding="0" cellspacing="0" style="top:0px; height:107px; background-color:#00CCFF;">
                <tr>
                    <td>sad</td>
                    <td style="width:180px; background-color:#33CC33">asd</td>
                    <td style="width:252px; background-color:#FF3300">asda</td>
                </tr>
            </table>
            asdasd
        </div>
    </div>
</body>
</html>

не указывая длину таблицы

Автор: tequilla4white 20.9.2007, 18:41

Да, этот вариант работает отлично, но дело в том, что мне надо ширина 100% smile

По идеи то, если ширина блока(таблицы) 100% он должен растягиваться на всю ширину родительского элемена. IE это понимает, только делает это как то по своему smile

Автор: tequilla4white 20.9.2007, 22:24

Проблема разрешилась. Если кому интересно, то... Надо добавить следующую строку, которая будет работать только в IE:

Код


* html div#main { height:1%; }

И все...