文章/答案/技术大牛

发布

问在底部对齐div
EN

Stack Overflow用户

提问于 2015-06-17 18:31:20

回答 1查看 284关注 0票数 4

我有一个想要在页面底部对齐的div。为此，我使用了以下内容--

<div style="position:fixed;bottom:0;overflow:auto;word-wrap:break-word;display:block" ng-show="noData || failedStatus">
    <div class="alert alert-danger" ng-show="noData" style="overflow:auto;word-wrap: break-word;">
        <!-- something -->
    </div>
    <div class="alert alert-danger" ng-show="failedStatus" style="overflow:auto;word-wrap: break-word;">
        <!-- something -->
    </div>
</div>

这段代码对齐了底部的div，但没有对div内部的单词进行包装。

javascript

html

css

angularjs

回答 1

Stack Overflow用户

发布于 2015-06-17 18:48:01

这是Fiddle Demo

您的css中缺少position:absolute;。

最推荐的做法是避免内联css，而是让类与父div关联，然后将css应用于它。

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<style>
.footer-div{
    bottom:0;
    overflow:auto;
    word-wrap:break-word;
    display:block;
    position: absolute;
}
</style>
</head>
<body>
<div class="footer-div" ng-show="noData || failedStatus">
    <div class="alert alert-danger" ng-show="noData" style="overflow:auto;word-wrap: break-word;">
        <!-- something -->
        Some text
    </div>
    <div class="alert alert-danger" ng-show="failedStatus" style="overflow:auto;word-wrap: break-word;">
        <!-- something -->
        Some text
    </div>
</div>
</body>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/30888959

复制

相似问题

问在底部对齐div
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在底部对齐divEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在底部对齐div
EN