Форум

imediasun1 · #1 (**permalink**) 28.10.2013, 00:24

Посмотрите пожалуйста http://vs-group.com.uaесть три черных блока под хэдером
при наведении на ссылки на крайне правом блоке появляется палец мыши, а при наведении на ссылки в крайне левом блоке палец появляется только в конце строки а не на буквах, мистика какая-то

<div class="info_block_1">
   <div id="links_info_block_1">
     <a href=""><p class="link_info_block_1">Внешняя реклама</p></a>
     <hr>
     <br>
     <a href=""><p class="link_info_block_2">Вывески</p>
     <a href=""><p class="link_info_block_2">Неон</p>
  </div>
</div>
<div class="info_block_2">
   <img src="/img/logo_romb.png">
</div>
<div class="info_block_1">
   <div id="links_info_block_2">
     <a href=""><p class="link_info_block_1">Дизайн и полиграфия</p></a>
     <hr>
     <br>
     <a href=""><p class="link_info_block_2">Реклама</p></a>
     <a href=""><p class="link_info_block_2">Деловая</p></a>
   </div>
</div>

.info_block_1 {
z-index:0;
position:relative;
}
.info_block_1 a{
 
}
#links_info_block_1 a:hover{
 
}
#links_info_block_2  a:hover{
 
}
 
#links_info_block_1{
position:absolute;
padding:10px;
width:230px;
text-align:left;
}
#links_info_block_2{
position:absolute;
padding:10px;
width:230px;
text-align:right;
 
}
.link_info_block_1{
position:relative;
z-index:999;
cursor:pointer;
color:#fec813;
font-size:17px;
}
.link_info_block_2{
color:#fff;
font-size:17px;
position:relative;
z-index:999;
display:block;
 
}

ksa · #2 (**permalink**) 28.10.2013, 08:43

Сообщение от imediasun1

мистика какая-то

Мистики тут не бывает...

Просто один элемент перекрывает другой.

Так говнокодить еще уметь нужно!

<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.info_block_1 {
	z-index:0;
	position:relative;
}
.info_block_1 a{
}
#links_info_block_1 a:hover{
}
#links_info_block_2  a:hover{
}
#links_info_block_1{
	position:absolute;
	padding:10px;
	width:230px;
	text-align:left;
}
#links_info_block_2{
	position:absolute;
	padding:10px;
	width:230px;
	text-align:right;
}
.link_info_block_1{
	position:relative;
	z-index:999;
	cursor:pointer;
	color:#fec813;
	font-size:17px;
}
.link_info_block_2{
	color:#fff;
	font-size:17px;
	position:relative;
	z-index:999;
	display:block;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div class="info_block_1">
	<div id="links_info_block_1">
		<a href=""><p class="link_info_block_1">Внешняя реклама</p></a>
		<hr>
		<br>
		<a href=""><p class="link_info_block_2">Вывески</p>
		<a href=""><p class="link_info_block_2">Неон</p>
	</div>
</div>
<div class="info_block_2">
	<img src="/img/logo_romb.png">
</div>
<div class="info_block_1">
	<div id="links_info_block_2">
		<a href=""><p class="link_info_block_1">Дизайн и полиграфия</p></a>
		<hr>
		<br>
		<a href=""><p class="link_info_block_2">Реклама</p></a>
		<a href=""><p class="link_info_block_2">Деловая</p></a>
	</div>
</div>
</body>
</html>

imediasun1 · #3 (**permalink**) 28.10.2013, 12:45

Я вас не понял вы просто повторили мой код, что тут не так, как определить какой элемент перекрывает и как исправить

imediasun1 · #4 (**permalink**) 28.10.2013, 12:47

от правильный ответ

.info_block_1 {
      z-index: 1;
    }

Форум

Справочник

Discord чат

Курсы javascript