Локально подключен bootstrap,возможно запутался в наследовании..
.main-section.team{
padding:85px 0;
}
.main-section.team h6{
margin-bottom:40px;
}
.team-leader-block{
max-width:993px;
margin:0 auto;
}
.team-leader-box{
width:30.66%;
margin-right: 3.82979%;
height: 490px;
overflow: hidden;
text-align: center;
float: left;
}
.team-leader-box span{
margin-bottom:24px;
display:block;
}
.team-leader-box:nth-of-type(3n+0){ margin:0;}
.team-leader{
width:auto;
height:auto;
position:relative;
border-radius:50%;
box-shadow:0px 0px 0px 7px rgba(241,241,241,0.80);
margin:7px 7px 25px 7px;
}
.team-leader-shadow{
transition:all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-webkit-transition:all 0.3s ease-in-out;
border-radius:50%;
position:absolute;
width:100%;
height:100%;
z-index:10;
border-radius:50%;
}
.team-leader-shadow a{
display:block;
width:100%;
height:100%;
}
.team-leader:hover .team-leader-shadow{
box-shadow:inset 0px 0px 0px 148px rgba(17,17,17,0.80);
}
.team-leader:hover ul{ display:block; opacity:1}
.team-leader img{
display:block;
border-radius:50%;
}
.team-leader ul{
display:block;
opacity:0;
padding:0;
margin:0;
list-style:none;
position:absolute;
left:0;
top:50%;
width:100%;
text-align:center;
margin-top:-14px;
z-index:15;
transition:all 0.6s ease-in-out;
-moz-transition:all 0.6s ease-in-out;
-webkit-transition:all 0.6s ease-in-out;
}
.team-leader ul li{
display:inline;
margin:0 11px;
}
.team-leader ul li a{
font-family: 'FontAwesome';
display:inline-block;
font-size:28px;
color:#fff;
transition:all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-webkit-transition:all 0.3s ease-in-out;
}
.team-leader ul li a:hover, .team-leader ul li a:focus{
text-decoration:none;
}
<section class="main-section cv" id="cv" style="margin:0 auto;">
<!--t section start-->
<div class="container">
<h2>text</h2>
<h6>Take a closer look</h6>
<div class="team-leader-block clearfix" style="margin:0 auto; !important">
<div class="team-leader-box">
<div class="team-leader wow fadeInDown delay-06s">
<div class="team-leader-shadow">
<a href="http://jabascii.zzz.com.ua/cv/"></a>
</div><img alt="" src="img/prof.jpg">
<ul>
<li class="url">
<a class="fa-letter" href="#"></a>
</li>
</ul>
</div>
<h3 class="wow fadeInDown delay-06s">Text</h3>
<p class="wow fadeInDown delay-06s">Text</p>
</div>
</div>
</div>
</section><!--T section end-->
Уберите width у
.team-leader-box
Задайте нужную ширину
.team-leader-block
html в верхнем посте скинул кривой.
<section class="main-section team" id="team">
<!--t section start-->
<div class="container">
<h2>text</h2>
<h6>Take a closer look</h6>
<div class="team-leader-block clearfix">
<div class="team-leader-box">
<div class="team-leader wow fadeInDown delay-06s">
<div class="team-leader-shadow">
<a href="url"></a>
</div><img alt="" src="img/prof.jpg">
<ul>
<li class="url">
<a class="fa-letter" href="#"></a>
</li>
</ul>
</div>
<h3 class="wow fadeInDown delay-06s">Text</h3>
<p class="wow fadeInDown delay-06s">Text</p>
</div>
</div>
</div>
</section><!--T section end-->
при наведении на элемент делаю бордерно начинается дискотека
Нужно чтобы было 2 больших изображенияНо после клика на одну из миниатюр, второе увеличенное изображение пропадает
Есть таблица, которая прекрасно отображается во всех браузерах кроме IE разных версийВыяснил, что в нем tbody не реагирует на display: flex;