04.08.2019 в 21:27, Ваня:

не срабатывают классы

<HTML>
помогите, не могу разобраться, делал по шаблону! в первом случае с работало, а во втором случае не могу задать ни какие свойства.
<td>
<Работает 1 - случай>
<a href="#">
<div class="icon">
<i class="fa fa-cogs" aria-hidden="true"></i>
<i class="fa fa-cogs" aria-hidden="true"></i>
</div>
<div class="name" ><span data-text="Document">Document</span></div>
</a>

</td>
<td>
<ul>
< не работает 2 - случай>
<a id="a1" href="#">
<div class="linode1">
<i class="fa fa-ravelry" aria-hidden="true"></i>
</div>
<div id="name1" ><span id="span1" data-text="generate">generate</span></div>
</a>


<ССS>
td a{

text-decoration: none;
display: block;

}

td a .icon{
width: 40px;
height: 40px;
text-align: center;
background: #f7f7f7;/*задний фон иконки*/
overflow: hidden;
margin: 0 auto;
}

td a .icon .fa{
width: 100%;
height: 100%;
line-height: 40px;
font-size: 34px;
transition: 0.5s;
color: #000;

}
td a .icon .fa:last-child
{
color: #e91e63;
}

td a:hover .icon .fa{
transform: translateY(-100%);
}

td a .name{

position: relative;
height: 20px;
width: 100%;
display: block;
overflow: hidden;
}
td a .name span{
display: block;
position: relative;
color: #000;
font-size: 18px;
line-height: 20px;
transition: 0.5s;

}

td a .name span:before{

content: attr(data-text);
position: absolute;
top: -100%;
left: 0;
width: 100%;
height: 100%;
color: ##e91e63;
}

td a:hover .name span{

transform: translateY(20px);
}

td a .linode1{

width: 70px;
height: 70px;
text-align: center;
background: #f7f7f7;/*задний фон иконки*/
overflow: hidden;
margin: 0 auto;

}

#a1 td ul {
width: 300px;
height: 300px;

}

#name1{

}

#span1{

}

Ответы

может надо td ul #a1 ?

—  joey, 17.08.2019 в 23:46 ответить #

Добавить ответ