回复固定在底部:css样式用到了

box-sizing属性

box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */

box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。

例如,假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框,并把边框和内边距放入框中。

为元素设定的宽度和高度决定了元素的边框盒。

就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。

通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。

position:absolute      绝对布局

bottom:0      距离底部的距离

<div class="page" id="forum_details" data-pageTitle="查看全文">
<div class="all_text">
<div class="talk_item">
<div class="top">
<span class="fr">话题12</span>
<h2>
微信昵称123<strong>07-19</strong>
</h2>
</div>
<p class="mid">
两市今天涨跌互现,个股活跃度虽然较低,但估值较适中、有成长性或者在改革大势里有成长潜力的公司得到市场认同
</p>
</div>
<div class="all_text_reply">
<p>
<strong>张三:</strong>根据证券经纪业务的相关规定及财富证券集中交易系统使用规。
</p>
<p class="reply">
<strong>王五 回复 张三:</strong>根据证券经纪业务的相关规定及财富证券集中交易系统使用规。
</p>
</div>
</div>
<div style="width: 100%; padding: 0 1.5rem; box-sizing: border-box; position: absolute; bottom: 0;">
<a href="javascript:void(0);" class="mod_btn">回 复</a>
</div> <!-- 弹窗 -->
<div class="window" style="display: none;">
<div class="window_area">
<textarea name="comment" id="comment" cols="30" rows="10"
placeholder="140个字以内"></textarea>
<span class="btn_box"> <a href="javascript:void(0);"
class="cancel">取消</a> <a href="javascript:void(0);" class="ok">发送</a>
</span>
</div>
</div>
</div>

  

css样式控制元素固定在底部的更多相关文章

  1. php部分:网页中报表的打印,并用CSS样式控制打印的部分;

    网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...

  2. css 样式控制文本过长实现省略号

    css 样式控制文本过长实现省略号 .topicTitle{ text-overflow: ellipsis; max-width: 75%; overflow: hidden; white-spac ...

  3. 3种纯css方法控制元素隐藏显示

    1.通过hover,也是最常用的方式.此方法要求按钮与被控制元素必须有层级关系.(兼容低端浏览器常用) <div class="nav-btn"> <h2> ...

  4. python + selenium webdriver 复合型css样式的元素定位方法

    <div class="header layout clearfix"></div> 当元素没有id,没有name,没有任何,只有一个class的时候,应该 ...

  5. css的理解 ----footrt固定在底部

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css样式控制 字符个数,多余的字用省略号代替

    大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多多指教 <div class="show">大家好,我是小菜 前端 ,技术不高,正在努力中充电!希望大家多 ...

  7. 用div和css样式控制页面布局

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  8. css样式控制鼠标滑过显示

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. css样式---隐藏元素

    1.通过设置width:0;或height:0 2.将元素的opacity设置成0 3.通过定位将元素移出屏幕范围 4.通过text-indent实现隐藏文字的效果 5.通过z-index隐藏一个元素 ...

随机推荐

  1. FreeBSD 用kgdb调试kernel dump文件

    FreeBSD 用kgdb调试kernel dump文件 来自: http://blog.csdn.net/ztz0223/article/details/8600052 kgdb貌似和ddb一样属于 ...

  2. TortoiseGit保存用户名和密码的方法

    TortoiseGit在提交或者pull时总会提示你输入用户名密码,非常麻烦,那如何解决呢? 1. 对于TortoiseGit 1.8.1.2及其后的版本,右键选择settings ——> Gi ...

  3. HDU 5687 Problem C(Trie+坑)

    Problem C Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others) Tota ...

  4. mongodb学习(3)--- NodeJs使用mongoose操作mongodb

    转载: https://cnodejs.org/topic/50c145ed637ffa4155c7eaee 首先对于以下错误说明(有写 db.close): Error: db object alr ...

  5. mac 安装 maven 配置

    前面的话: 记录 在 Mac 下 安装配置 maven 1. 下载 Maven, 并解压到某个目录.例如/Users/robbie/apache-maven-3.3.3 2. 打开 Terminal, ...

  6. 游戏(bzoj 1854)

    Description lxhgww最近迷上了一款游戏,在游戏里,他拥有很多的装备,每种装备都有2个属性,这些属性的值用[1,10000]之间的数表示.当他使用某种装备时,他只能使用该装备的某一个属性 ...

  7. favicon还是这个网站生成的比较正确

    原文发布时间为:2011-11-16 -- 来源于本人的百度文章 [由搬家工具导入] http://tools.dynamicdrive.com/favicon/ http://www.rw-desi ...

  8. practical system design with mef & mef[ trans from arup.codeplex.com/]

    Practical System Design using MEF MVVM RX MOQ Unit Tests in WPF Posted on May 21, 2015 by Arup Baner ...

  9. Windows消息钩取

    @author: dlive @date: 2016/12/19 0x01 SetWindowsHookEx() HHOOK SetWindowsHookEx( int idHook, //hook ...

  10. 【Visual Studio】简单内存泄漏检测方法 解决 Detected memory leaks! 问题(转)

    原文转自 http://blog.csdn.net/u011430225/article/details/47840647 我的环境是: XP SP2.VS2003 最近在一个项目中, 程序退出后都出 ...