div не работает в firefox/т.е. как в chrome

Может ли кто-нибудь сказать мне, почему это загрузочное изображение отлично отображается в Chrome, но не в Internet Explorer или Firefox? Он должен просто нормально перемещаться по странице, но Firefox и IE, кажется, помещают его в начало страницы.

Веб-сайт: http://thc-racing.ucoz.com/

HTML:

<div id="preload">Loading page... <img src="/design/loading.gif" /></div>

CSS:

div#preload {
    position: absolute;
    bottom: 40px;
    right: 50px;
    background-image: url('http://thc-racing.ucoz.com/design/loading-bg.png');
    padding: 8px;
    border-radius: 5px;
    border-style: solid;
    border-color: #d7d7d7;
    border-width: 1px;
    font-weight: bold;
    align: right;
}

Спасибо


google-chrome html css firefox incompatibility
person Skan So    schedule 21.08.2013    source источник
comment
попробуйте верхний, левый для позиционирования вместо нижнего, правого.   -  person palerdot    schedule 21.08.2013
comment
Что такое align: right;? Вы имеете в виду text-align: right;?   -  person Wilson Biggs    schedule 21.08.2013
comment
Уилсон Биггс на самом деле ничего не значит, моя ошибка   -  person Skan So    schedule 21.08.2013
comment
Палердот не работает, все еще там   -  person Skan So    schedule 21.08.2013
comment
Не уверен, но загрузочное изображение отображается во всех этих трех браузерах одинаково (в верхнем левом углу).   -  person putvande    schedule 21.08.2013
comment
align: right не является допустимым CSS. Вы имеете в виду text-align: right?   -  person nullability    schedule 21.08.2013
comment
Я думаю, это происходит потому, что ваш div стоит перед открывающим тегом html. Вы должны поместить его в тег body. Кажется, на вашем сайте много проблем. У вас есть дополнительный HTML-код, который не находится внутри тега html/body. Это вызывает проблемы.   -  person putvande    schedule 21.08.2013
comment
putvande везде один и тот же результат, ожидаемого результата нет   -  person Skan So    schedule 21.08.2013
comment
Куда нужно идти? Вертикально и горизонтально по центру?   -  person putvande    schedule 21.08.2013
comment
putvande, вот скриншот с тем, как это должно выглядеть thc-racing.ucoz.com/problem_ss. jpg   -  person Skan So    schedule 21.08.2013
comment
Ну, я бы начал с размещения HTML в теге body. Если вы это сделаете, это должно сработать.   -  person putvande    schedule 21.08.2013
comment
путванде тот же результат, в хроме работает, в фф/т.е. нет, можете проверить сейчас, он в теле   -  person Skan So    schedule 21.08.2013
comment
похоже, я нашел проблему (я думаю), css не предоставляет необходимый код для div, в chrome он есть, но не в ff/ic, добавление css со стилем = работает везде. кто-нибудь знает, почему он не читает код css?   -  person Skan So    schedule 21.08.2013

Ответы (1)


arrow_upward
0
arrow_downward

Ответ заключается в том, как (вероятно) Firefox и Internet Explorer понимают div, мне пришлось заменить div таблицей, потому что они не смогли правильно прочитать CSS, поэтому вот код:

HTML:

<table id="preload"><tbody><tr><td style="padding:8px;">Loading page... </td><td style="padding:8px;"><img src="/design/loading.gif" /></td></tr></tbody><table>

CSS:

#preload { border-collapse: separate !important; position:absolute; bottom:40px; right:50px; font-weight:bold; background-image:url('/design/loading-bg.png'); border-radius:5px; border-style: solid; border-color:#d7d7d7; border-width: 1px; border-spacing: 0; }

теперь все работает отлично, спасибо всем за помощь

person Skan So    schedule 21.08.2013