• Познакомьтесь с пентестом веб-приложений на практике в нашем новом бесплатном курсе

    «Анализ защищенности веб-приложений»

    🔥 Записаться бесплатно!

  • CTF с учебными материалами Codeby Games

    Обучение кибербезопасности в игровой форме. Более 200 заданий по Active Directory, OSINT, PWN, Веб, Стеганографии, Реверс-инжинирингу, Форензике и Криптографии. Школа CTF с бесплатными курсами по всем категориям.

Css позиционирование

  • Автор темы ioni
  • Дата начала
I

ioni

Народ,
теперь мне нужна помощь!

Никак не могу понять, почему у меня в Firefox
Код:
<div style="float:right; display:inline;">Some text</div>
ведет себя, как будто он <div style="float:right; display:table ;">Some text</div>
Другими словами, кусок текста, который должен был прижат к правому краю в результате прижимается (что правда, то правда), но перносит все остальное ниже себя.

Есть идеи?
Мне нужно, чтобы sometext был "обтекаемым" и находился справа - то есть именно, что предполагает CSS. В IE все работает чудесно, но в Firefox 2.0.3 - блок получается необтекаемым...

Может быть, поменять Doctype? Сейчас у меня стоит
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
W

Wings

ну с цсс в файрвоксе вообще частенько всречаються разногласия, отображаются по разному.
Ну вобщем я не понял в чем у тебя проблема
у меня этот кусок кода отображается везде одинаково, вожможно кинь больший кусок кода
а лучше бей страничку таблицами
 
I

ioni

Ну как же, все так его любят...
Как я только под IE все далю, так мне, в общем и целом, все равно, но чего только не сделаешь для пользователей...


Вот - и ты сразу увидишь, в чем проблема...


Кроме того, таблицы - это точно не для меня, я свою стадию "таблицевания" уже давно прошел :(
 
W

Wings

"версия для печати
отослать другу
добавить в Закладки " в 5 експлорере очень большим шрифтом и не влазит в выделеное для этого место.
Файрфокс и опера - нормально.
проблему вижу, помочь не могу, думаю ты уже варианты перебрал
 
I

ioni

Ох, я для 5го IE даже не стал проверять...
И, кстати, у меня в ФФ уходит вниз сам список статей из-за гугловской рекламы...
Странное дело, что у тебя не так...
 
I

ioni

Наконец-то у меня было время...
Итак, проблема возникает, только если внутри ДИВа лежит ява скрипт гугловский...
То есть, если его нет - то все размещается правильно.

Естьу кого ответ, как подоборь эту хрень?

Пример страницы:
Напоминаю, в IE работает хорошо, в FF - блок рекламы "выезжает" наверх и текстом не обтекается...
 
I

ioni

Хорошо.
Теперь у меня стоит XHTML Strict
Див без рекламы позиционируется офигенно - именно так как надо все всех бройзерах
Стоит бодавить Google Adsense - и все, позиционирует по-своему...

Я даже второй див пробовал поставить снаружи, чтобы обтекало уже его - и все равно FF поступает, как хочет
 
I

ioni

При этом IE6 работает просто отлично....
 
I

ioni

У меня также чувство, что никто не знает, в чем дело...
 
I

ioni

С первой частью разобрались.
Еффект шел от объявления dislay:table во внейшнем контейнере div.
Теперь вместо этого я объявляю просто ширину от левого края и получаю такой же результат

Теперь следующий вопрос:
Почему первый пост обтекается, а остальные - переносятся вниз, но при этом "как бы" частично обтекаются? Это на самом деле надо видеть - обяснения вразумительного происходящему у меня нету...

Еще раз: проблема наблюдается только в FF 2
 
I

ioni

Короче, достаточно было прогнать через валидатор и все сразу стало понятно.
Теперь сайт оборажается одинаково в FF/ Opega 9 / IE 6 /IE 7

А таргет аудитория не будет пользовать ничего другого...
Если в логах увижу - тогда и буду присматривать
 
A

Andrew Stephanoff

Извини, давно не заходил, так бы помог.
Так делать не рекомендуется:
Код:
<div style="float:right; display:inline;">Some text</div>
По сути, это тоже самое, что
Код:
<span style="float:right;">Some text</span>

Для просмотра стилей (и наследуемых в том числе) удобно использовать плагин для FF FireBug
 
I

iRabbit

Никак не могу понять, почему у меня в Firefox
Код:
<div style="float:right; display:inline;">Some text</div>
ведет себя, как будто он <div style="float:right; display:table ;">Some text</div>
Другими словами, кусок текста, который должен был прижат к правому краю в результате прижимается (что правда, то правда), но перносит все остальное ниже себя.

В соответствии со спецификацией CSS float-элементы -- это блочные элементы. То есть если задать тэгу css-свойство float: left, то он автоматически становится display: block. То, что IE всё перемешивает -- не новость, у него плохо со спецификацией. Советую придерживаться следующего хода работы: сначала тестируешь вёрстку в современных браузерах, а потом по убывающей в остальных (IE7, IE6, ...). Когда будешь находить разногласия в IE, то задавай им CSS правила отдельно от всего мира, чтобы они "приходили в себя", не имея возможности работать правильно со всеми.
 
Мы в соцсетях:

Обучение наступательной кибербезопасности в игровой форме. Начать игру!