Group Homepage 25

by pphheerroonn

HTML

<div class="brand-container">
  <div class="brand brand-1">
  <h2>Select</h2>
  <img src='https://uk.selectonline.com/static/version1740658171/frontend/SelectTech/hyva-b2c/en_GB/images/logo.svg'>
  <p class="description">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vel interdum orci. Vestibulum porta mi urna, sit amet finibus velit tempor a. Integer eu orci ut odio dapibus rutrum. 
  </p>
  </div>
  <div class="brand brand-2">
  <h2>Brand 2</h2>
  <p class="description">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vel interdum orci. Vestibulum porta mi urna, sit amet finibus velit tempor a. Integer eu orci ut odio dapibus rutrum. 
  </p>
  </div>
  <div class="brand brand-3">
  <h2>Brand 3</h2>
  <p class="description">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vel interdum orci. Vestibulum porta mi urna, sit amet finibus velit tempor a. Integer eu orci ut odio dapibus rutrum. 
  </p>
  </div>
  <div class="brand brand-4">
  <h2>Brand 4</h2>
  <p class="description">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vel interdum orci. Vestibulum porta mi urna, sit amet finibus velit tempor a. Integer eu orci ut odio dapibus rutrum. 
  </p>
  </div>
</div>

<style>
.brand-container{
 
  height:100vw;
}

.brand{
  height:100vw;
  top: 50px;
  position: sticky;
}
.brand.brand-1{
  background: lightblue url("https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg") no-repeat center;
}
.brand.brand-2{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}
.brand.brand-3{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}
.brand.brand-4{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}

</style>

CSS

.brand-container{
  height:500px;
  overflow-y: scroll;
}

.brand{
  height:100vw;
  top: 50px;
  position: sticky;
}
.brand.brand-1{
  background: lightblue url("https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg") no-repeat center;
}
.brand.brand-2{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}
.brand.brand-3{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}
.brand.brand-4{
  background-image: url('https://www.jtrs.co.uk/web/image/760811-1f1e7e2c/iPad%20Children.jpg');
}