diff --git a/css/styles.css b/css/styles.css index 4601e34..6397ce9 100644 --- a/css/styles.css +++ b/css/styles.css @@ -41,6 +41,7 @@ body { background-color: var(--main-bg); display: flex; flex-direction: column; + overflow-x: hidden; } .container { @@ -110,6 +111,8 @@ img { width: calc(100% - 250px); padding: 0 20px 20px 20px; position: relative; + box-sizing: border-box; + overflow-x: hidden; } /* Logo */ @@ -154,6 +157,8 @@ img { cursor: pointer; transition: background-color 0.3s ease; margin-right: 10px; + flex-shrink: 0; + white-space: nowrap; } .install-pwa-button:hover { @@ -317,12 +322,13 @@ img { top: 0; z-index: 50; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); - width: calc(100vw - 250px); + width: 100%; + max-width: calc(100vw - 250px); margin-bottom: 20px; margin-left: -20px; padding-left: 40px; padding-right: 40px; - right: 0; + box-sizing: border-box; } .search-container { @@ -391,6 +397,7 @@ img { .social-icons, .action-icons { display: flex; align-items: center; + flex-shrink: 0; } .icon-button { @@ -1550,10 +1557,12 @@ img { /* Ajuster le header pour le mode sidebar compact */ .header { - width: calc(100vw - 70px); + width: 100%; + max-width: calc(100vw - 70px); margin-left: -20px; padding-left: 40px; padding-right: 40px; + box-sizing: border-box; } .nav-item span { @@ -1615,10 +1624,12 @@ img { /* Ajuster le header pour l'affichage mobile */ .header { - width: 100vw; + width: 100%; + max-width: 100vw; margin-left: -20px; padding-left: 35px; padding-right: 40px; + box-sizing: border-box; } .mobile-menu-toggle {