MiniUi遇到的一个Bug或者说坑,以div里面的内容自适应高度
页面源码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link href="css/demo.css" rel="stylesheet" type="text/css" />
<script src="scripts/boot.js" type="text/javascript"></script>
<link href="scripts/miniui/themes/blue/skin.css" rel="stylesheet" type="text/css" />
<link href="utf8-jsp/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="utf8-jsp/third-party/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" src="utf8-jsp/umeditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="utf8-jsp/umeditor.min.js"></script>
<script type="text/javascript" src="utf8-jsp/lang/zh-cn/zh-cn.js"></script>
<style type="text/javascript"> </style>
</head>
<body> <div id="test1" style="width: 550px; min-height: 100px; max-height: 600px; ">
<div class="mini-fit" style="background: white; float: left; ">
<table style="width: 500px; ">
<tr>
<td>
测试:
</td>
<td>
<div id="test2" style=""></div>
</td>
</tr>
</table>
</div>
</div> <a href="javascript: void(0);" id="div1a">1</a>
<a href="javascript: void(0);" id="div2a">2</a> <div id="test3" style="width: 550px; min-height: 100px; max-height: 600px; ">
<div style="background: white; float: left; ">
<table style="width: 500px; ">
<tr>
<td>
测试2:
</td>
<td>
<div id="test4" style=""></div>
</td>
</tr>
</table>
</div>
</div> <a href="javascript: void(0);" id="div3a">1</a>
<a href="javascript: void(0);" id="div4a">2</a> <script type="text/javascript"> mini.parse(); $("#div1a").on("click", function() {
$("#test2").html("1234567890");
}); $("#div2a").on("click", function() {
$("#test2").html(
"1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>"
);
}); $("#div3a").on("click", function() {
$("#test4").html("1234567890");
}); $("#div4a").on("click", function() {
$("#test4").html(
"1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>1234567890<br/>"
);
}); </script> </body>
</html>
页面默认效果(进入页面时不操作时):

分别点击1后效果:

分别点击2后效果:

两个div唯一的不同是,第一个有class="mini-fit",第二个没有.
所以,要自适应高度,去掉class="mini-fit",就好了.
MiniUi遇到的一个Bug或者说坑,以div里面的内容自适应高度的更多相关文章
- css挖坑爬坑之div高宽相等
目标效果 对于这么一个头像,外面是一个圆角的div里面是一个img,对于外面的div我要使他高度等于宽度. 发现问题 开始的时候设置宽度为100%然后高度为100%,这样子对于宽度来说的话可以撑满页面 ...
- 在chrome下-webkit-box布局的一个bug
chrome,也就是webkit内核下作的检测, chrome版本是40, -webkit-box这种布局在移动端用的比较多,主要是因为pc端的浏览器内核参差不齐. 因为在写HTML的时候看上了-we ...
- Curl的毫秒超时的一个”Bug”
Curl的毫秒超时的一个”Bug” -- PHP老杨 最近我们的服务在升级php使用的libcurl, 期望新版本的libcurl支持毫秒级的超时, 从而可以更加精细的控制后端的接口超时, 从而提高整 ...
- qt widget设置Qt::FramelessWindowHint和Qt::WA_TranslucentBackground, 会出现一个bug: 在最小化后还原时界面停止刷新
qt widget设置Qt::FramelessWindowHint和Qt::WA_TranslucentBackground, 会出现一个bug: 在最小化后还原时界面停止刷新 Widget wit ...
- 2019年12月的第一个bug
现在是2019年12月1日0点27分,我的心情依旧难以平静.这个月是2019年的最后一个月,是21世纪10年代的最后一个月,也是第一批90后30岁以前的最后一个月.就是在这个月的第一天的0点0分,我写 ...
- 印象最深的一个bug:sessionStorage缓存在移动端失效
无bug,不程序:作为程序员的我,不是修bug就是在写bug的路上. 移动端sessionStorage缓存失效是我"印象最深的一个bug"之一,为啥呢,因为这个问题导致我加班到很 ...
- 我大抵是卷上瘾了,横竖睡不着!竟让一个Bug,搞我两次!
作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言:一个Bug 没想到一个Bug,竟然搞我两次! 我大抵是卷上瘾了,横竖都睡不着,坐起来 ...
- Tomcat一个BUG造成CLOSE_WAIT
之前应该提过,我们线上架构整体重新架设了,应用层面使用的是Spring Boot,前段日子因为一些第三方的原因,略有些匆忙的提前开始线上的内测了.然后运维发现了个问题,服务器的HTTPS端口有大量的C ...
- MySQL关于exists的一个bug
今天碰到一个很奇怪的问题,关于exists的, 第一个语句如下: SELECT ) FROM APPLY t WHERE EXISTS ( SELECT r.APPLY_ID FROM RECORD ...
随机推荐
- leetcode面试题42. 连续子数组的最大和
总结一道leetcode上的高频题,反反复复遇到了好多次,特别适合作为一道动态规划入门题,本文将详细的从读题开始,介绍解题思路. 题目描述示例动态规划分析代码结果 题目 面试题42. 连续子数 ...
- 浅谈静态布局、流式布局,rem布局,弹性布局、响应式布局
静态布局: 特点:没有兼容性问题 PC:居中布局,所有样式使用绝对宽度/高度(px),设计一个Layout,在屏幕宽高有调整时,使用横向和竖向的滚动条来查阅被遮掩部分:移动设备:另外建立移动网站,单独 ...
- FSBPM流程引擎(002)之表单+自定义流程挂载到引擎
本章节介绍如何将实际业务的表单和自定义流程挂载到FSBPM流程引擎上. 首先进入引擎交互界面: 点击创建:->出差申请 然后根据实际的业务输入对应的数据项即可,比如[姓名,部门,开始时间,结束时 ...
- cooke和session
一.装饰器要加入funtools.wrap装饰 保留函数的元数据(函数名/注释) 1.装饰器 def wrapper(f): def inner(*args,**kwargs): return f(* ...
- turtle学习笔记续集
turtle(海龟)是Python重要的标准库之一,它能够进行基本的图形绘制.turtle图形绘制的概念诞生于1969年,成功应用于LOGO编程语言. turtle库绘制图形有一个基本框架:一个小海龟 ...
- ui自动化chrome文件上传操作
web自动化,再chrome浏览器中文件上传操作
- Codeforces Round #200 (Div. 2)E
Read Time 题意:有一个数组,很多指针指在这个数组上,每次每个指针可以向左或向右移动一个位置.给出一些需要访问的位置,问访问用的最少时间. 一个指针只可能转一次方向.二分答案. #includ ...
- 【MyBatis笔记】mapper文件的配置以及说明
<!doctype html>[MyBatis笔记]mapper文件的配置以及说明 figure:last-child { margin-bottom: 0.5rem; } #write ...
- Python-操作XML文件
一.python对XML文件的操作 目录 1.xml 创建 2.xml 数据查询 3.xml 数据修改 4.xml 数据删除 二. 1.xml 创建 import xml.etree.ElementT ...
- Python-hashlib、OS、Random、sys、zipfile模块
# print(sys.version) #python 版本 # print(sys.path) # print(sys.platform) #当前什么系统 # print(sys.argv) #当 ...