20. sticky footer

  -通过 / -执行

"Sticky footer" is a layout pattern that

  1. if content is short, the footer "sticks" to the bottom
  2. otherwise, footer is is displayed after the content as normal.

Suppose we have some HTML structure:

<div class="container">
  <div class="header">header</div>
  <div class="body">
    content here might be tall , might be short
  </div>
  <div class="footer">footer</div>
</div>

Below is how Sticky Footer pattern should behave.

1.内容长度不够时,footer贴在底部

2.其他的情况正常显示

3.甚至于footer不会显示在viewport中

(23)