div没有内容的时候依然保持占位,不会被覆盖

div分为左中右浮动,当左边没有内容,只有宽度高度自适应的情况下,左边的位置就会被中间的内容占据,如下图:

为了让空的div也占位,可以添加一个最小的高度min-height 1px即可,也可以设置border:true;这样就可以保证div一直占位

原文地址:https://www.cnblogs.com/my466879168/p/12258357.html

时间: 2024-10-10 15:25:49

div没有内容的时候依然保持占位,不会被覆盖的相关文章

让2个并列的div根据内容自动保持同等高度js

有左右2个并列的div,2个div都不能限定高度.左div为导航,右div为内容.如何能让左div块自动获得和右div块相等的高度? 同时,也有网友提问到“如果右块高度比左块低,会不会导致左块的内容被溢出不显示之类的问题.应该是取左右2者的最高值吧来对齐吧”. 的确应该是哪个div Height值大,就将其值赋给Height值小的div,从而使2个div高度始终保持一致. function $(id){ return document.getElementById(id) } function

DIV的内容自动换行

word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了. 2,word-wrap:break

如何让2个并列的div根据内容自动保持同等高度

最近在工作中碰到一个需求: 有左右2个并列的div,2个div都不能限定高度.左div为导航,右div为内容.如何能让左div块自动获得和右div块相等的高度?刚进公司好一段纠结那个时候技术好垃圾的路过(现在也很垃圾) 请看代码 function $(id){ return document.getElementById(id) } function getHeight() { if ($("left").offsetHeight>=$("right").of

python如果想输出原格式的内容,可以加''' ''',占位符使用方式

print('我考了%d分'%20) msg=''' ---------info of %s----------- name: %s age: %d #字符串不能放到%d处 job: %s salary: %f you will be retired in %s years #数字可以放到%s处 ---------end--------------- '''%('tom','tom',20,'it',3444.44,45) print(msg) python如果想输出原格式的内容,可以加'''

获取DIV内部内容报错

1.错误描述 2.错误原因 由于向div中添加元素,利用append(); $("#divStyle").append("<div><label>_data[i].name</label></div>"); append里面是动态数据,当请求数据为空时,获取并判断div中的内容: var divContent = $("#divStyle").html(); if(divContent == nul

Overflow属性——定义元素(如Div)内容区溢出情况

说明:overflow属性规定当内容溢出元素框时发生的事情. 注释:属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制.因此,有可能即使元素框中可以放下所有内容也会出现滚动条.默认值是 visible. 可用的值: visible:默认值.内容不会被修剪,会呈现在元素框之外. hidden:内容会被修剪,并且其余内容是不可见的. scroll:内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容. auto:如果内容被修剪,则浏览器会显示

设置DIV根据内容自动调整高度的三个方法

Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid="content"></div></div> 当Content内容很多时,即使main设置了高度100%或auto.在除IE外的其他浏览器中还是不能完好的自动伸展.也就是说,内容的高度容器main的高度还是没有自动撑开. 我们有三种方法可以解决这个问题. 一,增加一

JS如何导出Div的内容为图片

最近因为项目需要,研究了几天用js导出页面上的div为图片.项目需求是这样的,一个页面上有统计图和统计表,另外一部分是地图,当用户点击导出报告时,需要将页面内容导出到Excel,统计表可以从后台查出列表,然后以表格形式导出:统计通采用的echarts,可以转换为base64编码,然后后台处理之后导出.但是地图这块就有点难了,首先地图不是一张图片,其次地图的图片不在本地,所以虽然我自己的功能没实现,但是研究出了div导出为图片,需要的就拿走. div导出为图片,并不是直接完成的,原理可以认为截取屏

css div中内容绝对居中(多行内容)

div中的内容绝对居中(不适合IE6哦,IE6我已经不考虑了),直接看代码吧. <!DOCTYPE HTML> <html> <head> <title>绝对居中 </title> <style type="text/css"> h1, h2, h3, h4, h5 { margin:0px; padding:0px; } .panel { width:300px; height:150px; background