左边label随着右边自适应

近期项目中,有表单需求
默认展示两列,当内容多的时候,可以展示一列
左边列
<div>
<label>备注</label>
<span>计算机</span>
</div>
右边列
<div>
<label>备注</label>
<span>计算机</span>
</div>
当右边有textarea的时候,让textarea高度随着内容自适应
同时左边的标题label有灰色背景,也随着右边一起自适应高度
刚开始思考 费解
最后 通过 正负数值撑开
.box div label{
display: inline-block;
padding-bottom:1000px; /* new */
margin-bottom:-1000px; /* new */
background: #dedede;
}
padding-bottom:正最大 , margin-bottom:负最大
即可抵消 自适应高度
详情可见附件:http://files.cnblogs.com/files/leshao/%E5%B7%A6%E8%BE%B9label%E9%9A%8F%E7%9D%80%E5%8F%B3%E8%BE%B9%E8%87%AA%E9%80%82%E5%BA%94.rar

感谢 一棵树!哈

左边label随着右边textarea高度自适应的更多相关文章

  1. textarea高度自适应自动展开

    在使用之前,推荐两个比较好的事件,分别是oninput和onpropertychange,IE9以下不兼容oninput.在textarea发生变化时,可以通过监听这两个事件来触发你需要的功能. te ...

  2. 实用小工具不定期合集(textarea 高度自适应、自动计算Y轴刻度、json转table)

    1.textarea高度自适应 这个非常有用,但是网上的解决方案都不尽人意,话不多说,上代码. function auto (elem) { var minHeight = 30 var change ...

  3. textarea高度自适应问题

    textarea中的文字如果过多,就会产生滚动条,一本分文本被遮盖住,不能看到所有的文本. 那么,如何才能让textarea的高度随输入内容多少,可以自动的改变高度呢? 解决思想: 1 利用conte ...

  4. 实现textarea高度自适应内容,无滚动条

    最近接触到一个很好用的js插件,可以实现textarea高度随内容增多而改变,并且不显示滚动条,推荐给大家: http://www.jacklmoore.com/autosize/

  5. textArea 高度自适应

    <textarea name="apparatus" class="dhxTextArea" style="width:100%;height: ...

  6. textarea高度自适应,随着内容增加高度增加

    $(function(){        $.fn.autoHeight = function(){            function autoHeight(elem){             ...

  7. css实现 textarea 高度自适应

    此textarea非彼textarea ,有经验的老司机们应该知道html标签contenteditable这个属性. 利用此属性使当前的标签成为可以输入的状态,等同于输入框. 演示地址:https: ...

  8. textarea高度自适应解决方法

    引入autosize.js <script src="./autosize.js"></script> autosize(document.getEleme ...

  9. textarea高度自适应

    var tx=document.getElementById("tx"); tx.style.height=tx.scrollHeight+"px" tx.st ...

随机推荐

  1. 我的第一个python web开发框架(18)——前台页面与接口整合

    由于我们前后台系统没有分开,所以前台页面调用接口时,可以直接使用后台管理系统已经完成的接口,不过后台管理系统接口的访问加上了登录验证,所以需要将前台要用到的接口进行处理,让它们设置到白名单当中 我们打 ...

  2. Java中string 创建对象时 “”和null的差别

    null和""的差别 问题一: null和""的差别 String s=null; string.trim()就会抛出为空的exception String s ...

  3. 关于Oracle处理DDL和DML语句的事务管理

    SQL主要程序设计语言 数据定义语言DDL(Data Definition Language) 如 create.alter.drop, 数据操作语言DML(Data Munipulation Lan ...

  4. Axure学习笔记(一)

    Axture是一种快速制作原型的工具,在产品经理和体验设计师之中非常流行,不过现在产品经理比较难找,所以我只好上阵研究了一下.        经过几天的研究,看了小楼老师的一些视频,看了一些文档,做了 ...

  5. 《设计模式:可复用面向对象软件的基础》【PDF】下载

    <设计模式:可复用面向对象软件的基础>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382288 内容介绍 <设计模式:可复 ...

  6. JaveScript用二分法与普通遍历(冒泡)

    二分法 查找 概念: 从有序的数列中,折半查找. 思路: --> 找到数组中最中间的元素,将其作为基准 --> 从0开始判断数组中的元素,与基准进行比较 --> 比基准小的元素,存入 ...

  7. OC学习15——文件I/O体系

    OC提供了丰富的I/O相关API,如果只是管理文件和目录,程序可以使用NSFileManager进行管理,包括创建.删除.移动和复制文件等:如果程序需要读取文件内容,则可通过NSFileHandle进 ...

  8. UILabletext去掉乱码 控制颜色 行高 自定义大小 。显示不同的字体颜色、字体大小、行间距、首行缩进、下划线等属性(NSMutableAttributedString)

    text去掉乱码 设置不同颜色 行高 自定义大小 #import <Foundation/Foundation.h> @interface TextsForRow : NSObject @ ...

  9. ios 访问隐私信息 info.plist 中的字段

    1.iOS10相册相机闪退bug: iOS10系统下调用系统相册,相机功能,遇到闪退的情况,描述如下: This app has crashed because it attempted to acc ...

  10. 【Zookeeper】源码分析目录

    Zookeeper源码分析目录如下 1. [Zookeeper]源码分析之序列化 2. [Zookeeper]源码分析之持久化(一)之FileTxnLog 3. [Zookeeper]源码分析之持久化 ...