Перейти к содержимому



Помогите с css в опере

#1 kapadult

kapadult
  • Пользователь
  • 5 сообщений
  • Репутация: 0
0

Отправлено 21 Август 2009 - 13:27

Привет всем! Помогите разобраться с css. В общем проблема в следующем, мне нужно чтобы при наведении на ссылку, в необходимом месте всплывала картинка. В IE и Firefox все рабоотает нормально, а вот в Опере почему-то картинка смещена намного вниз. С чем это может быть связано?

Код ссылки я описывать не буду, там просто добавляется class="picture", а вот css код посмотрите:

.picture{ 
position: relative; 
z-index: 0; 
} 

.picture:hover{
background-color: #CECECE; 
z-index: 0px;
} 

.picture span{
position: absolute; 
background-color: #CECECE; 
padding: 5px;
left: 150px; 
border: 1px dashed gray; 
visibility: hidden; 
color: #CECECE; 
text-decoration: none; 
} 

.picture span img{ 
border-width: 0; 
padding: 0px;
} 

.picture:hover span{
visibility: visible; 
top: -3px;
left: 740px;

}

 

 

  • 0

#2 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 21 Август 2009 - 14:32

kapadult,
вы бы код таки показали достаточно полный, на котором можно увидеть описанное смещение.
Потому как у меня ничего сколько-нить заметно не смещается, а гадать, в чем у меня и у вас разница - неинтересно.


  • 0

#3 kapadult

kapadult
    Topic Starter
  • Пользователь
  • 5 сообщений
  • Репутация: 0

Отправлено 21 Август 2009 - 16:01

так я вроде все описал... :rolleyes:

тот код вставляю в теги <STYLE>, а ссылка при наведении на которую появляется картинка имеет такой вид:

<a class="picture" href="http://xxx.com/" target="_blank"></a>

в IE картинка появляется в нужном месте, а вот в опере она смещена...


  • 0

#4 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 21 Август 2009 - 21:44

kapadult, попробуйте так:
.picture{ 
position: relative;
z-index: 0; 
} 

.picture:hover{
background-color: #CECECE; 
z-index: 0px;
} 

.picture span{
position: absolute; 
background-color: #CECECE; 
padding: 5px;
left: 150px; 
border: 1px dashed gray; 
display: none; 
color: #CECECE; 
text-decoration: none; 
} 

.picture span img{ 
border-width: 0; 
padding: 0px;
} 

.picture:hover span{
display: block;
top: -3px;
left: 740px;

}

  • 0

#5 kapadult

kapadult
    Topic Starter
  • Пользователь
  • 5 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 14:21

Не прокатывает... :) Мне тут еще посоветовали минусовое значение в top'e убрать, что тип невалидное значение, но и это не помогло... Главное, такой косяк почему только у оперы. Если кто не понял проблему, то объяняю - картинка, которая должна поялвяться в опр. месте, смещена ровно вниз. Хотя в других браузерах все нормально!


  • 0

#6 Евгений

Евгений
  • Пользователь
  • 481 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 15:43

kapadult, у меня такое чувство что вы что то скрываете xD)

<a class="picture" href="http://xxx.com/" target="_blank"></a>

не верю что ссылки имеют такой вид.

иначе зачем в коде

.picture span{}
.picture span img{ }


я записал точно так же как вы все выложили, у меня не то что там что то смещается, у меня вообще ниче не происходит xD) а гадать что там у вас как ссылка в реале выглядит и что смещается я не хочу... либо выкладывайте весь код, либо ждите телепатов
  • 0

#7 kapadult

kapadult
    Topic Starter
  • Пользователь
  • 5 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 17:04

Да ничего я не скрываю!)) просто span c картинкой не дописал, но я не думаю что это кардинально что-то меняет... я имею ввиду мою проблему...

Вот полная ссылка:
 

<a class="picture" href="http://www.masterwebs.ru" target="_blank">Masterwebs<span><img src="index.files/1.jpg" /></span></a>

Мне советовали изменить изменить занчение top на неотрицательное, но это тоже не помогло... :)


  • 0

#8 Евгений

Евгений
  • Пользователь
  • 481 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 17:18

kapadult, вы самую главную часть скрыли

<span><img src="index.files/1.jpg" /></span>

без этой строчки вообще ниче не работало)))

щас вот вижу, но у меня в опере картинка показывается точно там же где и в ie6. где она на самом деле должна быть?
  • 0

#9 kapadult

kapadult
    Topic Starter
  • Пользователь
  • 5 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 17:26

Евгений, Напротив ссылки справа... В опере она у меня почему-то в правом нижнем углу появляется...


  • 0

#10 Евгений

Евгений
  • Пользователь
  • 481 сообщений
  • Репутация: 0

Отправлено 22 Август 2009 - 18:42

вот что у меня отображается при наведении на ссылку в опере
1234567.jpg
  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru