• How do I change the position of the slider text? I would like to move it down and to the right. I would also like to keep it in place on only one slide.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The way it works right now, you can only change it to be the same for all your slides.

    You need to play around with the carousel caption CSS. Here’s some I played around with at one point:

    .carousel-caption {
      max-width: 22em; /*Don't let it cover too much of the slide */
      display: inline; /*shrinks block around the text*/
      top: 30%;
      height: 7.5em;
      left: 7.5%;
      padding: 2%; /*Was 5, but this takes up too much room */
    }
    .carousel-caption h1,
    .carousel-caption .lead {
      line-height: 1;
      color: white;
      display: block;
    }

    Change the values to match your needs.

    I wanted to shrink the slider text, and move it to the bottom right corner. This code did the trick:

    .carousel-caption {
    max-width: 40%; /* was 60% */
    margin-left: 2%; /* was 11% */
    padding: 2%;  /* was 5% */
    position: absolute;
    left:60%;
    bottom:0px; /* hugs the bottom of the slider */
    }
    /* shrink the Title field */
    .carousel-caption h1 {
    font-size: 24px; /* was inherited from h1 (38.5px) */
    line-height: 1; /*was 1.25 */
    }
    /* shrink the description field */
    .carousel-caption .lead {
    font-size: 16px; /* was inherited from lead (21 px) */
    line-height: 1; /* was 1.25 */
    }
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Slider Text Position’ is closed to new replies.