Почему пропадает блок?
Не показывает не какую информацию..
При чисто HTML,CSS все прекрасно работает, начал встраивать в WP он не показывает контент.
/*owl-carousel*/
.block-carousel {overflow:hidden;}
.owl-box {margin-left: -10px; margin-right:-10px;}
.owl-box .shortstory-in {margin:0 10px !important; width:auto; float:none}
.owl-box .shortstory {margin:0 !important}
.owl-carousel .owl-wrapper:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.owl-carousel {display: none; position: relative; width: 100%; -ms-touch-action: pan-y;}
.owl-carousel .owl-wrapper {display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px);}
.owl-carousel .owl-wrapper-outer {overflow: hidden; position: relative; width: 100%;}
.owl-carousel .owl-wrapper-outer.autoHeight{
-webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out;
-ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out;}
.owl-item.loading {min-height: 150px; background: url(AjaxLoader.gif) no-repeat center center}
.owl-carousel .owl-item {float: left;}
.owl-controls .owl-page, .owl-controls .owl-buttons div {cursor: pointer;}
.owl-controls {
-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none;
-ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
/*.grabbing {cursor:url(grabbing.png) 8 8, move;}*/
.owl-carousel .owl-wrapper, .owl-carousel .owl-item {
-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden;
-webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0);}
.owl-controls {text-align: center}
.owl-controls .owl-prev, .owl-controls .owl-next {
position:absolute; top:50%; color:#fff; background:#9B59B6; font-size:20px;
filter: Alpha(Opacity=80); opacity: 0.8; z-index:5; border-radius:3px; margin-top:-30px;
width:38px; height:60px; line-height:60px;}
.owl-controls .owl-prev {left:10px;}
.owl-controls .owl-next {right:10px;}
.owl-controls.clickable .owl-buttons div:hover {filter: Alpha(Opacity=100); opacity: 1; background:#526480;}
.owl-pagination {height:30px; line-height:30px; position:absolute; top:-42px; right:10px}
@media (max-width: 467px) {.owl-pagination {position:static;}}
#related-news .owl-pagination {position:static !important; margin-top:20px;}
.owl-controls .owl-page {display: inline-block; vertical-align:middle; zoom: 1; *display: inline;}
.owl-controls .owl-page span {
display: block; width: 10px; height: 10px; margin-left: 4px;
filter: Alpha(Opacity=80); opacity:0.8; background: #fff; border-radius:50%}
.owl-controls .owl-page.active span,
.owl-controls.clickable .owl-page:hover span {background:#9B59B6; filter: Alpha(Opacity=100); opacity: 1}
.owl-orange .owl-prev, .owl-orange .owl-next {background:#FF6907}
.owl-blue .owl-prev, .owl-blue .owl-next {background:#02B0E4}
.owl-red .owl-prev, .owl-red .owl-next {background:#FC1A3F}
.owl-green .owl-prev, .owl-green .owl-next {background:#2ECC71}
.owl-violet .owl-prev, .owl-violet .owl-next {background:#9B59B6}
.owl-yellow .owl-prev, .owl-yellow .owl-next {background:#FFC146}
.owl-orange .owl-controls .owl-page.active span, .owl-orange .owl-controls.clickable .owl-page:hover span {background:#FF6907}
.owl-red .owl-controls .owl-page.active span, .owl-red .owl-controls.clickable .owl-page:hover span {background:#FC1A3F}
.owl-blue .owl-controls .owl-page.active span, .owl-blue .owl-controls.clickable .owl-page:hover span {background:#02B0E4}
.owl-green .owl-controls .owl-page.active span, .owl-green .owl-controls.clickable .owl-page:hover span {background:#2ECC71}
.owl-violet .owl-controls .owl-page.active span, .owl-violet .owl-controls.clickable .owl-page:hover span {background:#9B59B6}
.owl-yellow .owl-controls .owl-page.active span, .owl-yellow .owl-controls.clickable .owl-page:hover span {background:#FFC146}
/* closed */
Вот и сам HTML код
<div class="row">
<div class="col-sm-6 col-xs-12">
<div class="owl-trailer owl-cat owl-red">
<h2 class="h-owl"><a href="#" title="#">Новые трейлеры</a></h2>
<div class="owl-box">
<div id="owl-trailer" class="owl-carousel">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<!--CONTEINER-1-->
<div class="shortstory-in shortstory-trailer">
<div class="shortstory radius-3">
<div class="short-images radius-3">
<a href="#" title="<?php the_title(); ?>" class="short-images-link">
<img src="http://gigafilm.net/uploads/posts/2018-05/han-solo-zvezdnye-voyny.-istorii.jpg" style="height: 400px;" alt="<?php the_title(); ?>" />
<span class="short-trailer">
<i class="fa fa-play"></i>
</span>
</a>
</div>
<div class="short-content">
<h4 class="short-link"><a href="#" title="<?php the_title(); ?>"><?php the_title(); ?></a></h4>
</div>
</div>
</div>
<!--CLOSED CONT-1-->
<?php endwhile; ?>
<?php else : ?>
<?php endif; ?>
</div>
</div>
</div>
</div>
Именно при вставке owl-carousel как класс пропадает, все переделал уже понять не могу почему..
На чистом HTML все работает но в wp нет.
