VPF::Опять IE6 или элементы не помещаются (хотя должны)

tequilla4white

Дата 20.9.2007, 10:52 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 8.1.2007
Где: Крым

Репутация: нет
Всего: нет

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

Код


<!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"...

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

Это сообщение отредактировал(а) tequilla4white - 20.9.2007, 10:52

kizune

Дата 20.9.2007, 11:33 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 277
Регистрация: 10.7.2007

Репутация: 9
Всего: 9

наверное так

Код


<!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 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 8.1.2007
Где: Крым

Репутация: нет
Всего: нет

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

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

tequilla4white

Дата 20.9.2007, 22:24 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 8.1.2007
Где: Крым

Репутация: нет
Всего: нет

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

Код


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

И все...

Это сообщение отредактировал(а) tequilla4white - 20.9.2007, 22:25

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »