Image alignment on the Carousel

Asked

Viewed 908 times

0

How can I do this central alignment, and not get superimposed on the header menu?

<div class="row">
    <div id="carousel-example-generic" align="center" class="carousel slide col-md-8" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    <li data-target="#carousel-example-generic" data-slide-to="3"></li>
    <li data-target="#carousel-example-generic" data-slide-to="4"></li>
    <li data-target="#carousel-example-generic" data-slide-to="5"></li>
    <li data-target="#carousel-example-generic" data-slide-to="6"></li>
    <li data-target="#carousel-example-generic" data-slide-to="7"></li>
    <li data-target="#carousel-example-generic" data-slide-to="8"></li>
    <li data-target="#carousel-example-generic" data-slide-to="9"></li>
  </ol>

  <!-- slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <img src="imagens/flower-stormdesign.jpg" alt="...">
      <div class="carousel-caption">
        ...
      </div>
    </div>
    <div class="item">
      <img src="imagens/flower-stormdesign.jpg" alt="slide 1">
      <div class="carousel-caption">
      </div>
    </div>
  </div>
html

  • What are you using to create the carousel? And what’s the problem?

  • I want it to be in the center of the page, but not below the menu in the header. But I’ve tried N things, and the only thing that worked best was inserting the class="container", but still, it was under the menu. I am using the Bootstrap Carousel

1 answer

1

You can enter the parameter text-align:center;in the class CSS or div you want to center, for example, if div you can use:

div {
text-align:center;
}

If a class should be used:

.carousel-inner {
    text-align:center;
    }

Cases are a li should use:

.carousel-indicators li {
    text-align:center;
}

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.