Styjun

the overflow:hidden property is working in google chrome and not in firefox and microsoft edge, i'am using it to give full page height to a sidebar so that it will have the same body height.

Style:

.sidebar 
 position:absolute;
 width: 225px;
 background-color: #4b4b4b;
 margin-bottom: -5000px;
 padding-bottom: 5000px;
 overflow: hidden;
 

html :

<div class="sidebar">
 <div class="nav-item active">
 <a class="nav-link border-bottom border-warning Request::path()=='home' ? 'selectioné' : ''" href="home"><span>Dashboard</span></a>
 </div>
 <div class="nav-item">
 <a class="nav-link border-bottom border-warning Request::path()=='register' ? 'selectioné' : ''" href="register"><span>Ajout Compte</span></a>
 </div>
 <div class="nav-item">
 <a class="nav-link border-bottom border-warning" href="*******"><span>*******</span></a>
 </div>
 <div class="nav-item">
 <a class="nav-link border-bottom border-warning" href="/telescope" target="_blank"><span>Telescope</span></a>
 </div>
 <div class="nav-item">
 <a class="nav-link border-bottom border-warning" href="tables.html"><span>Tables3</span></a>
 </div>
 <div class="nav-item">
 <a class="nav-link border-bottom border-warning" href="tables.html"><span>Tables4</span></a>
 </div>
</div>

body :

body 
 position: relative;
 min-height: 100vh;
 padding-bottom: 4.5rem;
 

footer:

footer 
 position: absolute;
 border-radius: 12px;
 right: 0;
 bottom: 0;
 width: calc(100% - 225px);
 height: 80px;
 background-color: #e2e2e2;
 text-align: center;
 padding-top: 28px;
 font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;

main:

.main 
 width: 100%;
 padding-left: 225px;
 padding-top: 11px;
 padding-bottom: 30px;

how can i make this work in all browsers ?

try this :

.sidebar 
 width: 225px;
 background-color: #4b4b4b;
 position: absolute;
 top: 60px;
 bottom: 0;

Remove margin-bottom: -5000px; padding-bottom: 5000px; from .sidebar css and add min-height: 100vh;, i hope it'll resolve your issue. Thanks

.sidebar 
 position:absolute;
 width: 225px;
 min-height: 100vh;
 background-color: #4b4b4b;
 overflow: hidden;