From 7868ec717588e03fb8003f13958f7b3356879452 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=9CAndolin=E2=80=9D?= <“andolini.y@gmail.com”> Date: Tue, 2 Sep 2025 23:58:15 +0200 Subject: [PATCH] I have changed the page --- images/menu.png | Bin 0 -> 4534 bytes index.html | 5 ++- styles/style.css | 104 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 108 insertions(+), 1 deletion(-) create mode 100644 images/menu.png diff --git a/images/menu.png b/images/menu.png new file mode 100644 index 0000000000000000000000000000000000000000..c8f355e0e25f19438a9c7684e24dd29d809b43e1 GIT binary patch literal 4534 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 PT_`?Yeut{xV}1H>d4Pwi literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 1b8846b..91894b2 100644 --- a/index.html +++ b/index.html @@ -6,10 +6,11 @@ Ironhack News +

Ironhack News

-
+ +
Article 1 Image diff --git a/styles/style.css b/styles/style.css index 9571ab1..1a0bf89 100644 --- a/styles/style.css +++ b/styles/style.css @@ -177,3 +177,107 @@ header { } /* Write your CSS below */ + + +@media screen and (max-width:760px){ + ul.navbar + { + display: flex; + flex-direction: column; + /* background-color: #007bff; */ + } + + .navbar li + { + width: 100%; + border-bottom:2px solid #ccc; + + } + + .navbar li:last-child + { + border-bottom: none; + } + +main +{ +display: flex; +flex-direction: column; +gap: 10px; +justify-content: space-between; +justify-content: stretch; +} + +.articles-container +{ + flex-direction: column; +} + +main > .main-article, +main > .articles-container > .article { + width: 80vw; + display: flex; + flex: 1; + flex-direction: column; + justify-content: space-between; + padding: 16px; + border: 1px solid #ccc; + box-sizing: border-box; +} + +article +{ + +display: flex; +flex-direction: column; +justify-content: flex-start; +align-items: center; +} + +@media (min-width: 760px) , (max-width: 1024px) +{ + ul.navbar + { + display: flex; + flex-direction: row; + background-color: #007bff; + } + + .navbar li + { + width: 100%; + border-right:2px solid #ccc; + + } + + .navbar li:last-child + { + border-right: none; + } +} + +@media screen and (max-width: 480px) +{ +ul.navbar + { + display: flex; + flex-direction: row; + } + + .navbar li + { + width: 100%; + border-right:2px solid #ccc; + + } + + .navbar li:last-child + { + border-right: none; + } + + +} + + +}