2012-06-10 2 views
0

Я работаю над своего рода сценарием замены объявлений. Иногда рекламные объявления появляются внутри тегов, как это:Firefox: как абсолютно позиционировать div внутри td

<tr> 
    <td align="right" width="40%"><a><img src="ad.jpg"></a></td> 
    <td>123</td> 
</tr> 

Кикер, что я не могу изменить отображение значения объявления; для целей этого упражнения я должен наложить его на непрозрачный div, который должен быть абсолютно позиционирован, а также наследовать поля и поплавки и тому подобное.

Когда объявление находится внутри div и, по-видимому, плавает влево или вправо, позиционируя div над ним с соответствующим левым: 0; или справа: 0; css-атрибуты довольно просты. Однако, когда объявление оформляется с помощью td, кажется, что Firefox не делает его совершенно правильным, даже если в td добавлена ​​позиция: relative; стиль.

Вот как это выглядит в Chrome \ IE: (серая ячейка является первым td, красный - наложением, внутренняя ячейка без полей - iframe, которая должна быть наложена - вы не можете ее увидеть хорошо, потому что это время наслаивали :)) enter image description here

Вот как это выглядит в Firefox: enter image description here

код для наложения очень просто ...

<div style="right:0;margin-top:0px;margin-bottom:0px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;position:absolute;z-index:9999;background:red;width:300px;height:280px;"></div> 

... и он добавляется к рассматриваемому td.

Право: 0; свойство заставляет его стрелять изнутри, несмотря на то, что было заказано относительно позиционировать.

Что мне здесь не хватает?

+0

Можете ли вы предоставить [скрипку] (http://jsfiddle.net)? – N1ck

+1

Я не верю, что Firefox разрешает свойство position на элементах отображения таблицы (не помню точно), поэтому ваш «правый: 0», вероятно, применяется к следующему нестационарному предку. – animuson

+0

'position: relative' на самом деле не работает на элементах таблицы: http://stackoverflow.com/questions/7629326/position-relative-in-firefox/7629567#7629567. – thirtydot

ответ

1

Вы можете добавить позицию: относительный обертку DIV, как в следующей скрипке: http://jsfiddle.net/qfquj/

0

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

Смежные вопросы