mirror of
https://github.com/elisspace/pops.git
synced 2026-08-29 15:44:05 +00:00
fix barn images style to fit in screen
This commit is contained in:
18
p/barn.php
18
p/barn.php
@@ -18,31 +18,31 @@
|
||||
</div>
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="/pics/barn/barn_front.jpg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/barn_front.jpg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_004.jpeg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_004.jpeg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_005.jpeg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_005.jpeg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_006.jpeg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_006.jpeg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_007.jpeg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/signal-2021-04-09-011913_007.jpeg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/Barn Apt 2016 006.jpg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/Barn Apt 2016 006.jpg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/Barn Apt 2016 009.jpg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/Barn Apt 2016 009.jpg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/Barn Apt 2016 012.jpg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/Barn Apt 2016 012.jpg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="/pics/barn/Barn Apt 2016 013.jpg" class="d-block w-100" alt="...">
|
||||
<img src="/pics/barn/Barn Apt 2016 013.jpg" class="d-block img-fluid" alt="...">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#carousel-barn" data-bs-slide="prev">
|
||||
|
||||
10
styles.css
10
styles.css
@@ -19,4 +19,12 @@
|
||||
.caption h4 {
|
||||
color: #fff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
}
|
||||
|
||||
/* Barn‑apartment carousel */
|
||||
#carousel-barn .carousel-item img{
|
||||
max-height: 80vh; /* never taller than 80 % of the viewport */
|
||||
width: auto; /* shrink / grow to preserve aspect ratio */
|
||||
object-fit: contain; /* keep the whole photo in view */
|
||||
margin-inline: auto; /* centre portrait‑oriented photos */
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user