Responsive layout

2023-12-28 11:11:03 +00:00
parent f78c69e27e
commit 85d8e25964
1 changed files with 15 additions and 5 deletions
--- a/hcard.css
+++ b/hcard.css
@@ -1,11 +1,21 @@
-.h-card {
-  display: flex;
-  gap: 1rem;
-  align-items: center;
+.u-photo {
+  margin-inline: auto;
+  margin-block-end: 3rem;
+}
+
+@media (min-width: 48rem) {
+  .h-card {
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+  }
+
+  .u-photo {
+    margin: 0;
+  }
 }

 .u-photo {
  width: 256px;
-  height: 256px;
 }