Skip to content

Instantly share code, notes, and snippets.

@scrawlon
Last active May 1, 2019 16:22
Show Gist options
  • Save scrawlon/469e46c2bddbaf51eed971218fbeb7cb to your computer and use it in GitHub Desktop.
Save scrawlon/469e46c2bddbaf51eed971218fbeb7cb to your computer and use it in GitHub Desktop.
Swiper JS image slides CSS
<style>
.swiper-container {
height: 300px;
}
.swiper-slide {
background: lightgray;
text-align: center;
/* Center slide text vertically */
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.swiper-slide img {
position: absolute;
max-width: 100%;
}
.swiper-slide figcaption {
position: absolute;
bottom: 15%;
}
.swiper-slide a {
background: #000;
color: #fff;
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment