<?php
$randomArray = array(
'<figure><img src="images/hamburg.jpg" alt="Hamburg">
<figcaption>Hamburg</figcaption></figure>',
'<figure><img src="images/london.jpg" alt="London">
<figcaption>London</figcaption></figure>',
'<figure><img src="images/rome.jpg" alt="Rome">
<figcaption>Rome</figcaption></figure>'
);
$displayAtRandom =
$randomArray[array_rand($randomArray)];
echo $displayAtRandom;
?>
.bg-container {
padding: 2rem 1rem;
}
figure {
margin: 0 auto;
display: flex;
flex-flow: column;
padding: 5px;
max-width: 260px;
padding: 1em;
border-radius: 4px;
background: radial-gradient(
circle at 0% 0.5%,
rgb(241, 241, 242) 0.1%,
rgb(224, 226, 228) 100.2%
);
box-shadow: rgba(0, 0, 0, 0.24)
0px 3px 8px;
}
img {
max-width: 300px;
max-height: 200px;
}
figcaption {
padding-top: 10px;
text-align: center;
text-transform: uppercase;
font-size: smaller;
}