Bootstrap 3：中心和固定页脚

Question

以下是包含完整代码的jsFiddle。

如您所见，页脚由三个不同的部分组成：

1. 4列链接
2. A <hr/>
3. 版权声明
4. 隐私政策和服务条款的链接

我想：

• 将页脚居中（正如您所看到的，目前它略微偏向右侧）并且我通过center-block尝试无效
• 正如您所看到的，页脚正好向上推到了jumbotron的底部。我希望这是一个“粘性”页脚，这样它总是被固定在可视屏幕的底部，即使页面上没有很多内容（例如，只是一个超级按钮）。

我可以通过更改position: absolute;规则添加.footer定义来获得这种粘性，如下所示：

.footer {
    color: rgb(176,205,249);
    background: rgb(12,66,144);
    border-top: solid 5px rgb(176,205,249);

    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
}

然而，当我这样做时，页脚突破容器，浏览器显示水平滚动条 - 不可取。我有什么想法可以在这里实现我的目标吗？