Hej, jestem dopiero początkująca jeśli chodzi o CSS i potrzebuję pomocy z ułożeniem zdjęć tak jak na obrazku poniżej, żebym mogła później wykorzystać efekty transform i transition. Jak na razie nie mam nawet pomysłu, co zrobić żeby te zdjęcia były tak ułożone :/
Proszę chociaż o małe podpowiedzi. Wklejam swój kod HTML.
<!DOCTYPE html>
<html>
<head>
<title>Zadanie</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="zadanie.css">
<meta http-equiv="X-Ua-Compatible" content="IE=edge,chrome=1">
<!--pobrane z https://fonts.google.com -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&subset=latin-ext" rel="stylesheet">
</head>
<body>
<div class="container">
<header>
<h1>Chińskie zabytki</h1>
</header>
<div class="postcard">
<div class="photo1">
<a href="#"><img src="photo1.jpg" alt="photo of ..."></a>
</div>
<p>Lorem Ipsum</p>
</div>
<div class="postcard">
<div class="photo2">
<a href="#"><img src="photo2.jpg" alt="photo of..."></a>
</div>
<p>Lorem Ipsum</p>
</div>
<div class="postcard">
<div class="photo3">
<a href="#"><img src="photo3.jpg" alt="photo of ..."></a>
</div>
<p>Lorem Ipsum</p>
</div>
<div class="postcard">
<div class="photo4">
<a href="#"><img src="photo4.jpg" alt="photo of ..."></a>
</div>
<p>Lorem Ipsum </p>
</div>
</div>
</body>
</html>
