title: Carousel next previous buttons moving up and down how to fix it?
body: <p>When the slide changes the next previous buttons move up and down I am trying to figure out how to make sure that it remains in one position. I think it is somehow aligning itself according to the text (vertically at the center) so if the text is not equal in all the slides then it appears to move up and down.</p>
  
  <p><a href="https://jsfiddle.net/39amxqjd/4/" rel="nofollow noreferrer">https://jsfiddle.net/39amxqjd/4/</a></p>
  
  <p>
          
          </p>
  
  <pre><code>    &lt;!-- Color --&gt;
      &lt;link rel="stylesheet" type="text/css" id="skin"  href="assets/css/themes/default.css"&gt;
  
  &lt;div class="testimonial-section"&gt;
      &lt;div class="paralax-overlay"&gt;
      &lt;/div&gt;
      &lt;div class="testimonial-content"&gt;
          &lt;div class="container"&gt;
              &lt;div class="row wow"&gt;
                  &lt;div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 wow fadeInDown delay-07s"&gt;
                      &lt;div class="section-title"&gt;
                          &lt;h3&gt;
  
                              &lt;span&gt;
  
                              &lt;/span&gt;
                          &lt;/h3&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-md-push-2 col-md-8 wow fadeInUp delay-07s"&gt;
                      &lt;div class="carousel slide" data-ride="carousel" id="indecator"&gt;
                          &lt;ol class="carousel-indicators"&gt;
                              &lt;li class="active" data-slide-to="0" data-target="#indecator"&gt;
                              &lt;/li&gt;
                              &lt;li class="" data-slide-to="1" data-target="#indecator"&gt;
                              &lt;/li&gt;
                              &lt;li class="" data-slide-to="2" data-target="#indecator"&gt;
                              &lt;/li&gt;
                          &lt;/ol&gt;
                          &lt;div class="carousel-inner full_display" role="listbox"&gt;
                              &lt;div class="item sngl-testimonial active"&gt;
                                  &lt;div class="sngle-tsmt"&gt;
                                      &lt;div class="client-dsc"&gt;
                                          &lt;h3 style="color: #fff;"&gt;dsfdsf&lt;/h3&gt;
                                          &lt;p style="font-size: 19px;"&gt;
                                               fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd 
  
                                          &lt;/p&gt;
                                      &lt;/div&gt;
  
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="item sngl-testimonial"&gt;
                                  &lt;div class="sngle-tsmt"&gt;
                                      &lt;div class="client-dsc"&gt;
                                           &lt;br&gt;&lt;br&gt;&lt;br&gt;
                                          &lt;h3 style="color: #fff; font-size: 26px;"&gt;sfdsdfds&lt;/h3&gt;
  
                                          &lt;p style="font-size: 19px;"&gt;
                                              fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd 
                                          &lt;/p&gt;
                                      &lt;/div&gt;
  
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="item sngl-testimonial"&gt;
                                  &lt;div class="sngle-tsmt"&gt;
                                      &lt;div class="client-dsc"&gt;
                                          &lt;h3 style="color: #fff; font-size: 26px;"&gt;sdfsfsd&lt;/h3&gt;
                                          &lt;p style="font-size: 19px;"&gt;
                                              fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd fsdfdsfsd 
                                          &lt;/p&gt;
                                      &lt;/div&gt;
  
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;a class="left left_twit_crousel_btn" data-slide="prev" href="#indecator" role="button"&gt;
                              &lt;i class="fa fa-angle-left"&gt;
                              &lt;/i&gt;
                              &lt;span class="sr-only"&gt;
                                  Previous
                              &lt;/span&gt;
                          &lt;/a&gt;
                          &lt;a class="right right_twit_crousel_btn" data-slide="next" href="#indecator" role="button"&gt;
                              &lt;i class="fa fa-angle-right"&gt;
                              &lt;/i&gt;
                              &lt;span class="sr-only"&gt;
                                  Next
                              &lt;/span&gt;
                          &lt;/a&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-lg-2"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="clearfix"&gt;
  &lt;/div&gt;
  &lt;script
                src="https://code.jquery.com/jquery-3.3.1.min.js"
                integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
                crossorigin="anonymous"&gt;&lt;/script&gt;
  
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"&gt;&lt;/script&gt;
      &lt;script src="app.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Js Code</p>
  
  <pre><code>jQuery(document).ready(function() {
  
  
       // ------------------------------------------------------------------------------ //
      // owl Detail property
      // ------------------------------------------------------------------------------ //
      var changeSlide = 4; // mobile -1, desktop + 1
      // Resize and refresh page. slider-two slideBy bug remove
      var slide = changeSlide;
      if ($(window).width() &lt; 600) {
          var slide = changeSlide;
          slide--;
      } else if ($(window).width() &gt; 999) {
          var slide = changeSlide;
          slide++;
      } else {
          var slide = changeSlide;
      }
      $(document).ready(function() {
          $('.one').owlCarousel({
              nav: true,
              items: 1,
          })
          $('.wrap-features-bestproperties').owlCarousel({
              loop: true,
              items: 1,
              autoplay: true,
              autoplayTimeout: 4000,
              smartSpeed: 1200,
          })
          $('.two').owlCarousel({
              nav: true,
              margin: 15,
              mouseDrag: false,
              touchDrag: false,
              responsive: {
                  0: {
                      items: changeSlide - 1,
                      slideBy: changeSlide - 1
                  },
                  600: {
                      items: changeSlide,
                      slideBy: changeSlide
                  },
                  1000: {
                      items: changeSlide + 1,
                      slideBy: changeSlide + 1
                  }
              }
          })
          var owl = $('.one');
          owl.owlCarousel();
          owl.on('translated.owl.carousel', function(event) {
              $(".right").removeClass("nonr");
              $(".left").removeClass("nonl");
              if ($('.one .owl-next').is(".disabled")) {
                  $(".slider .right").addClass("nonr");
              }
              if ($('.one .owl-prev').is(".disabled")) {
                  $(".slider .left").addClass("nonl");
              }
              $('.slider-two .item').removeClass("active");
              var c = $(".slider .owl-item.active").index();
              $('.slider-two .item').eq(c).addClass("active");
              var d = Math.ceil((c + 1) / (slide)) - 1;
              $(".slider-two .owl-dots .owl-dot").eq(d).trigger('click');
          })
          $('.right').click(function() {
              $(".slider .owl-next").trigger('click');
          });
          $('.left').click(function() {
              $(".slider .owl-prev").trigger('click');
          });
          $('.slider-two .item').click(function() {
              var b = $(".item").index(this);
              $(".slider .owl-dots .owl-dot").eq(b).trigger('click');
              $(".slider-two .item").removeClass("active");
              $(this).addClass("active");
          });
          var owl2 = $('.two');
          owl2.owlCarousel();
          owl2.on('translated.owl.carousel', function(event) {
              $(".right-t").removeClass("nonr-t");
              $(".left-t").removeClass("nonl-t");
              if ($('.two .owl-next').is(".disabled")) {
                  $(".slider-two .right-t").addClass("nonr-t");
              }
              if ($('.two .owl-prev').is(".disabled")) {
                  $(".slider-two .left-t").addClass("nonl-t");
              }
          })
          $('.right-t').click(function() {
              $(".slider-two .owl-next").trigger('click');
          });
          $('.left-t').click(function() {
              $(".slider-two .owl-prev").trigger('click');
          });
      });
      // CLIENTS SLIDER LOGOS
      $(".clients-slider").owlCarousel({
          nav: true,
          margin: 15,
          rewind: true,
          smartSpeed: 1200,
          autoplay: true,
          navText: ["&lt;i class='fa fa-angle-left'&gt;&lt;/i&gt;", "&lt;i class='fa fa-angle-right'&gt;&lt;/i&gt;"],
          responsive: {
              0: {
                  items: 1
              },
              480:{
                  items:1
              },
              600: {
                  items: 2
              },
              1000: {
                  items: 5
              }
          }
      });
  
  });
  </code></pre>