CODEWITHSUNDEEP
htmlcssbootstrap-4sassangular-material
Nawfal bougrine
Nawfal bougrine

Reputation: 103

how to make that a sidebar take all the height of our web page?

here is my current sidebar:

sidebar

I would like that it always take all the height, how to do please?

I already tested height: 100% but it doesn't work here is my csss code:

#sidebar {
    /* don't forget to add all the previously mentioned styles here too */
    min-width: 250px;
    max-width: 250px;
    min-height: 100vh;
    /*background: #7386D5; */
    background-color: rgb(31, 40, 55);
    color: #fff;
    transition: all 0.3s;
    float: left;
    height : 100%;
}

Upvotes: 0

Views: 128

Answers (1)

Anna Azzam
Anna Azzam

Reputation: 262

height: 100% will make it take 100% of the container's height. Try using position: fixed or position: absolute to make it take 100% of the screen's height:

#sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    width: 250px;
}

Upvotes: 2

Related Questions