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 ...
随机推荐
- 前端每日实战:61# 视频演示如何用纯 CSS 创作一只咖啡壶
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/ZRjGGy 可交互视频 此视频是可 ...
- web前端问题整理
1.常用那几种浏览器测试?有哪些内核(Layout Engine)? (Q1)浏览器:IE,Chrome,FireFox,Safari,Opera (Q2)内核:Trident,Gecko,Prest ...
- Await/Async
Async其实就是Generator函数的语法糖. 啥是语法糖?就是一种更容易让人理解,代码可读性更高的另外一种语法. const asyncRead = async function(){ cons ...
- 16 搭建Spring Data JPA的开发环境
使用Spring Data JPA,需要整合Spring与Spring Data JPA,并且需要提供JPA的服务提供者hibernate,所以需要导入spring相关坐标,hibernate坐标,数 ...
- js数组方法全
js数组方法大全 一:前言 转载 作者:九夏 出处:https://www.cnblogs.com/jiuxia/ 我们在学到js中数组的时候,我们会接触到js中数组 ...
- python学习-练习题9*9乘法表巩固
9*9乘法表 分析: 1X1为一行 1X2 2X2 为一行 for i in range(1,10): for j in range(1,i+1): print(str(i) + 'X' + str( ...
- Golang package轻量级KV数据缓存——go-cache源码分析
作者:Moon-Light-Dream 出处:https://www.cnblogs.com/Moon-Light-Dream/ 转载:欢迎转载,但未经作者同意,必须保留此段声明:必须在文章中给出原文 ...
- NoVNC安装部署
noVNC 是一个 HTML5 VNC 客户端,采用 HTML 5 WebSockets, Canvas 和 JavaScript 实现,noVNC 被普遍用在各大云计算.虚拟机控制面板中,比如 Op ...
- ggplot2练习
图源于电力电子课本65页——电容滤波的单相不可控整流电路. f<-function(w,d) { l<-w/sqrt(w^2+1)*exp(-atan(w)/w)*exp(-d/w) r& ...
- Drf(DjangoRestFramewok)
第一部分 问题 1.前后端分离? vue.js 后端给前段返回json数据 2.移动端盛行. app 后端给app返回json数据 3.PC端应用? crm项目,前段后端一起写,运行在浏览器上. 一般 ...