Contoh css untuk 3 foto

October 25, 2023 Reza Ervani CSS 0

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  width: 100%;
  grid-gap: 4px;
}
 
img {
  max-width: 100%;
}
 
img:first-child {
  max-width: unset;
  height: 100%;
  width: 100%;
  object-fit: cover;
  grid-row: span 2;
}

&lt;div class="grid">
  &lt;img src="https://images.unsplash.com/photo-1618326985678-88285545a9aa?crop=entropy&amp;cs=srgb&amp;fm=jpg&amp;ixid=MnwxNDU4OXwwfDF8cmFuZG9tfHx8fHx8fHx8MTYyMDc5OTgyNA&amp;ixlib=rb-1.2.1&amp;q=85" alt="">
  &lt;img src="https://images.unsplash.com/photo-1618326985678-88285545a9aa?crop=entropy&amp;cs=srgb&amp;fm=jpg&amp;ixid=MnwxNDU4OXwwfDF8cmFuZG9tfHx8fHx8fHx8MTYyMDc5OTgyNA&amp;ixlib=rb-1.2.1&amp;q=85" alt="">
  &lt;img src="https://images.unsplash.com/photo-1618326985678-88285545a9aa?crop=entropy&amp;cs=srgb&amp;fm=jpg&amp;ixid=MnwxNDU4OXwwfDF8cmFuZG9tfHx8fHx8fHx8MTYyMDc5OTgyNA&amp;ixlib=rb-1.2.1&amp;q=85" alt="">
&lt;/div>

About Reza Ervani 431 Articles

Adalah pendiri programming.rezaervani.com -

Reza in Programming

Catatan Programming Reza Ervani

Contoh css untuk 3 foto

Be the first to comment

Leave a Reply Cancel reply