CODEWITHSUNDEEP
htmlcssfooter
p_e_88
p_e_88

Reputation: 1037

Fixed bottom in sidebar

im working right now on a custom admin template and i have a lil problem here. i have the two list points called .logout at the bottom of the left sidebar. the problem is that if i zoom into it they will move up and lays over the other menu points but i whant them at the bottom of it

.footer {
    bottom: 0px;
    clear: both;
    display: block;
    left: 0;
    padding: 0;
    position: fixed;
}

thats the css that the sidebar footer has.

.offcanvas-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    visibility: hidden;
    background: #fff;
    padding: 10px 0px;
    border-right: 1px solid #CCC;
    width: 300px;
    height: 100%;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

and thats the style of the offcanva sidebar if i gave the footer a position relative it will dock under the calender post and not at the bottom anymore. by position:absolute i will have the same problems again

demo

Upvotes: 2

Views: 7244

Answers (2)

Miguel Morera
Miguel Morera

Reputation: 469

Try this:

.sidebar-menu.footer {
  bottom: 0;
  width: 100%;
  position: absolute;
}

Upvotes: 2

Prashant Patil
Prashant Patil

Reputation: 2563

Try below css in your code

#menu{
overflow:auto;
}

no need of below css

.footer {
    bottom: 0px;
    clear: both;
    display: block;
    left: 0;
    padding: 0;
}

Upvotes: 2

Related Questions