I need arrow always visible, I use this: I try in my custom.css this: but with no luck.

Arrow always visible

chris2015Jan 4, 2017

I need arrow always visible, I use this:

<div id="related-portfolio" class="owl-carousel portfolio-carousel carousel-widget" 
data-margin="10" data-loop="true" data-dots="true" data-nav="true" data-pagi="false"
data-autoplay="5000" data-items-xxs="1" data-items-xs="2" data-items-sm="4" data-items-lg="5">

<div class="oc-item">
	<div class="iportfolio">
		<div class="box-image center-block"><a href="#">image 1</a></div>
		<div class="portfolio-desc center nobottompadding"><h3><a href="#">title 1</a></h3></div>
		<div class="product-price text-center">price 1</div>
	</div>
</div>
</div>

I try in my custom.css this:

.owl-theme .owl-controls .owl-nav [class*=owl-] {
    opacity: 1;background-color:#337ab7;color:#FFF;
    left: -18px;
}
.owl-theme .owl-controls .owl-nav .owl-next {
    left: auto;
    right: -18px;
}

but with no luck.

SemiColonWebSTAFFJan 5, 2017

Hello,

Simply use the following CSS code:

.owl-carousel .owl-nav [class*=owl-] {
	opacity: 1;
	left: -18px;
}

.owl-carousel .owl-nav .owl-next {
	left: auto;
	right: -18px;
}

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.