This question already has an answer here:

How to align content of a div to the bottom? 24 answers

---

You can use position: absolute; bottom: 0px; position: absolute; bottom: 0px; and position: relative; on its container.

Demo

.bottom {
    position: absolute;
    bottom: 0px;
}

However the absolutely positioned div will not expand the height of its container and will overlap other content if the height is too small.

Using relative positioning moves it x [unit] from its original position. Setting

position: relative;
bottom: 0;

will move it 0 [unit] upwards from the bottom.

---

DEMO HERE

you just need to add 2 rules.

.slNewClass {
    position: absolute;
    bottom:0 ; 
}

.mainTable {
    position: relative;
}

---

DEMO

Do the following:

set .slNewClass div to position: absolute; & bottom: 0px;

To avoid the content from overlapping absolute positioned div make .mainTable div box-sizing: to border-box then add add padding bottom like this padding-bottom: 130px;

Note: Bottom padding should be the same as bottom div height + some extra pixels for breathing space.

链接地址: http://www.djcxy.com/p/75782.html

上一篇: css如何在HTML页面的底部放置一个元素

下一篇: css如何使这个div在另一个div的底部