Ксдыщь!

Дилетантские заметки про XSLT/XPath, HTML/CSS и всякую фигню

Opera 7 Float Bug

17 ноября 2006 · Комментариев: 10 · Свалка

Думаю, большинство разработчиков уже успели столкнуться с багом при обработке вложенных float’ов в седьмой Опере.

Наиболее часто это всплывает при работе с горизонтальными списками:

ul {
    float:left;
    }
    li {
        float:left;
        }

Если для списка не задать ширину, то его элементы феерично выстроятся по вертикали. Во многих случаях проблему удается обойти обходными путями, но, к сожалению, не всегда.

Чип и Дейл спешат на помощь, собственно. Небольшая js-функция, которая возвращает все на свои места (для определения версии браузера используется Browser detect от PPK).

function fixOpera () {
    if (BrowserDetect.version < 8) {
        var listWidth = 0;
        var list = document.getElementById('test');
        var listItems = list.getElementsByTagName('li');
        for (var i = 0; i < listItems.length; i ++) {
            listWidth += listItems[i].offsetWidth;
        }
        list.style.width = listWidth;
    }
}

По необходимости меняем теги на нужные.

Рабочий пример. Для заценки необходима седьмая Опера, разумеется.

Теги: · ·

Комментариев: 10 ↓

  • pepelsbey // 17 ноября 2006 в 17:19

    Э, а display:table-cell и border’ы? Не поверишь, у меня в архивах лежит статья на эту же тему… Чёрт, надо было публиковать :)

  • Flack // 17 ноября 2006 в 17:32

    Да, у меня тоже была возня с display:inline-block;. Захотелось просто чего-то железобетонного :)

  • Иван Сагалаев // 17 ноября 2006 в 19:13

    Вообще, float с незаданной шириной имеет право вести себя неопределенно, потому что в CSS говорится, что ширина у него должна быть заданной (или intrinsic или явно).

  • Vitaly Harisov // 17 ноября 2006 в 22:45

    А я вот забил на 7-ку. ССЗБ не поддерживаем.

  • Michael Yakovis // 19 ноября 2006 в 06:49

    Слушай, а что за проекты такие, где стоит свеч поддержка седьмой Оперы? :)

  • Flack // 19 ноября 2006 в 13:59

    Миш, это самый что ни на есть личный перфекционизм.

  • Link // 20 ноября 2006 в 20:51

    Скажите, а Netscape 3.0 Gold Edition Вы не поддерживаете?

  • Flack // 20 ноября 2006 в 23:08

    К сожалению, мы отказались от поддержки его по религиозным причинам.

  • ThyBzi // 2 февраля 2008 в 11:11

    Поддержка седьмой Оперы стоит свеч в основном из-за того, что сам получаешь огромное удовлетворение, что дескать «опа! и тут работает» :))

    Автору отдельное спасибо за статью. Модифицированный код (со включенной в него проверку на Оперу) только что установил на sibinfonet.ru. А уж у кого и правда стоит 7-я Опера, да ещё и с отключенным яваскриптом… ну и пусть они уже идут лесом (а затем полем).

  • mr.L // 28 мая 2009 в 08:40

    К сожалению, поддержка даже седьмой оперы иногда актуальна и сегодня. Делаем сайт для достаточно крупной транснациональной компании, дак у них дофига где стоит эта древнючая опера. Такие постсовецкие организации неохотно обновляют софт =(

Оставить комментарий