From 4f6d0f94694cc56740092a10dd2cd3709e26bcd9 Mon Sep 17 00:00:00 2001 From: PatiNaka Date: Tue, 2 Sep 2025 15:14:44 +0100 Subject: [PATCH] lab2 ironhack news --- styles/style.css | 48 +++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 41 insertions(+), 7 deletions(-) diff --git a/styles/style.css b/styles/style.css index 9571ab1..440c781 100644 --- a/styles/style.css +++ b/styles/style.css @@ -4,18 +4,28 @@ html { box-sizing: border-box; font-size: 16px; } - -*, *:before, *:after { + +*, +*:before, +*:after { box-sizing: inherit; } - -body, h1, h2, h3, h4, h5, h6, p, ol, ul { + +body, +h1, +h2, +h3, +h4, +h5, +h6, +p, +ol, +ul { margin: 0; padding: 0; font-weight: lighter; } - /* DO NOT REMOVE - Styling for the label showing the viewport width */ .viewport-dimensions { position: fixed; @@ -27,7 +37,7 @@ body, h1, h2, h3, h4, h5, h6, p, ol, ul { padding: 5px 8px; font-size: 14px; } - + /* STYLES */ /* Fonts */ @@ -175,5 +185,29 @@ header { .btn-blue { background-color: #007bff; } - + /* Write your CSS below */ + +@media screen and (max-width: 400px) { + body { + } + .newspaper-name, + .navbar { + flex-direction: column; + align-items: center; + } + .main-article, + .articles-container { + flex-direction: column; + align-items: center; + width: 100%; + } + .main-article .content { + width: 100%; + } + + .article { + width: 100%; + margin-bottom: 35px; + } +}