左边label随着右边textarea高度自适应
左边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高度自适应的更多相关文章
- textarea高度自适应自动展开
在使用之前,推荐两个比较好的事件,分别是oninput和onpropertychange,IE9以下不兼容oninput.在textarea发生变化时,可以通过监听这两个事件来触发你需要的功能. te ...
- 实用小工具不定期合集(textarea 高度自适应、自动计算Y轴刻度、json转table)
1.textarea高度自适应 这个非常有用,但是网上的解决方案都不尽人意,话不多说,上代码. function auto (elem) { var minHeight = 30 var change ...
- textarea高度自适应问题
textarea中的文字如果过多,就会产生滚动条,一本分文本被遮盖住,不能看到所有的文本. 那么,如何才能让textarea的高度随输入内容多少,可以自动的改变高度呢? 解决思想: 1 利用conte ...
- 实现textarea高度自适应内容,无滚动条
最近接触到一个很好用的js插件,可以实现textarea高度随内容增多而改变,并且不显示滚动条,推荐给大家: http://www.jacklmoore.com/autosize/
- textArea 高度自适应
<textarea name="apparatus" class="dhxTextArea" style="width:100%;height: ...
- textarea高度自适应,随着内容增加高度增加
$(function(){ $.fn.autoHeight = function(){ function autoHeight(elem){ ...
- css实现 textarea 高度自适应
此textarea非彼textarea ,有经验的老司机们应该知道html标签contenteditable这个属性. 利用此属性使当前的标签成为可以输入的状态,等同于输入框. 演示地址:https: ...
- textarea高度自适应解决方法
引入autosize.js <script src="./autosize.js"></script> autosize(document.getEleme ...
- textarea高度自适应
var tx=document.getElementById("tx"); tx.style.height=tx.scrollHeight+"px" tx.st ...
随机推荐
- 直接编译caffe出现的两个问题
工控机的环境之前已经配置好ubuntu14.04+CUDA7.5+cuDNN v4,再加opencv3.1.要用ResNet做分类,需要重新编译一个caffe框架.下载BVLC/caffe,接着修改M ...
- Dynamic HTML权威指南(读书笔记)— 第一章 HTML与XHTML参考
1. 对齐常量(text-align和vertical-align) 1.1 盒外对齐 这种对齐属性决定环绕着元素外部矩形空间的文本对齐方式.W3C中,这类HTML元素包括:applet.iframe ...
- greenplum在执行vacuum和insert产生死锁问题定位及解决方案
首先声明:未经本人同意,请勿转载,谢谢! 本人使用自己编译的开源版本的greenplum数据库用于学习,版本为PostgreSQL 8.3.23 (Greenplum Database 4.3.99. ...
- Golang中的信号处理
信号类型 个平台的信号定义或许有些不同.下面列出了POSIX中定义的信号. Linux 使用34-64信号用作实时系统中. 命令 man 7 signal 提供了官方的信号介绍. 在POSIX.1-1 ...
- PHP+Apache怎样监控多个port和配置多网站
配置httpd.conf 监听多个port # Listen: Allows you to bind Apache to specific IP addresses and/or # ports, i ...
- Highcharts使用CSV格式数据绘制图表
Highcharts使用CSV格式数据绘制图表 CSV(Comma-Separated Values,逗号分隔值文本格式)是採用逗号切割的纯文本数据.通常情况下.每一个数据之间使用逗号切割,几个相关数 ...
- 二、springcloud Netflix 注册中心
Eureka是Netflix开源的一款提供服务注册和发现的产品,它提供了完整的Service Registry和Service Discovery实现.也是springcloud体系中最重要最核心的组 ...
- java泛型学习(一)
泛型也叫做参数化类型,顾名思义的去理解,就是把类型作为一个参数.类比方法的传参,我们举个例子. class A{ public void getX(int x){ System.out.println ...
- 自学Python5.2-类、模块、包
类.模块.包 一.类 类的概念在许多语言中出现,很容易理解.它将数据和操作进行封装,以便将来的复用. 二.模块module 通常模块为一个文件,直接使用import来导入就好了.可以作为module ...
- org.elasticsearch.transport.ReceiveTimeoutTransportException[cluster:monitor/nodes/liveness] request_id [31] timed out after [5000ms]
ES连接超时,异常信息 2017-09-07 10:42:45.042 [elasticsearch[Bantam][transport_client_worker][T#17]{New I/O wo ...