css中bug记录

1.margin塌陷,通俗叫法。

假如一个盒子box里边嵌套了两个盒子(记为box1,box2)。box1的margin-top不会如预想的一样在box顶部撑开一个边距,而是以包含box的容器上边界为基准撑开边距。

解决方法:一、设置box1 padding-top.

二、设置box display:absolute.

三、设置box overflow:hidden。

时间: 2024-10-16 13:13:24

css中bug记录的相关文章

浏览器中CSS的BUG

对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声明. 其它请参考:CSS hack 针对IE6,IE7,firefox显示不同效果 1.div的垂直居中问题  vertical-align:middle;  将行距增加到和整个DIV一样高 line-height:200px;  然后插入文字,就垂直居中了.缺点是要控制内容不要换行. 2. margin加倍的问题      设置为float的div在ie下设

CSS中常见的BUG调试

1.布局--layout 布局是windows提出的概念,用于控制元素的尺寸和定位. 拥有布局的元素负责自身及其子元素的尺寸及定位,而没有布局的元素仅仅能依靠近期的祖先元素进行控制. 通常在IE6中出现的BUG.非常可能是由于布局的缘故而产生的,因而修复IE中BUG的时候,第一件事就是尝试通过规则迫使元素拥有布局来看是否能修复. 默认情况下拥有布局的元素包含:body.html(标准模式下).table.tr.td.img.hr.input.select.textarea.button.ifra

移动端微信公众号开发中问题记录及解决方案

1. 关于字体大小.图片大小.块元素大小的确定,目前一种方法,使用rem,rem的计算方式 document.documentElement.style.fontSize = document.documentElement.clientWidth / 10.8 + 'px'; 其中10.8是设计图的大小除以100,这样就可以直接用设计图中的大小除以100的值. px, em, 和rem的区别: a. px是相对于显示器屏幕分辨率而言的. b. em是相对于对象内文本的字体尺寸,如果当前行内文本

深入理解CSS中的层叠上下文和层叠顺序(转)

by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.com/wordpress/?p=5115 零.世间的道理都是想通的 在这个世界上,凡事都有个先后顺序,凡物都有个论资排辈.比方说食堂排队打饭,对吧,讲求先到先得,总不可能一拥而上.再比如说话语权,老婆的话永远是对的,领导的话永远是对的. 在CSS届,也是如此.只是,一般情况下,大家歌舞升平,看不出什么差异,即所谓的众生平等.但是,当发生冲突发生纠葛的时

CSS中!important的使用

本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素style中的属性,但是如果使用!important,事情就会变得不一样. 首先,先看下面一段代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content

深入理解CSS中的层叠上下文和层叠顺序

零.世间的道理都是想通的 在这个世界上,凡事都有个先后顺序,凡物都有个论资排辈.比方说食堂排队打饭,对吧,讲求先到先得,总不可能一拥而上.再比如说话语权,老婆的话永远是对的,领导的话永远是对的. 在CSS届,也是如此.只是,一般情况下,大家歌舞升平,看不出什么差异,即所谓的众生平等.但是,当发生冲突发生纠葛的时候,显然,是不可能做到完全等同的,先后顺序,身份差异就显现出来了.例如,杰克和罗斯,只能一人浮在木板上,此时,出现了冲突,结果大家都知道的.那对于CSS世界中的元素而言,所谓的“冲突”指什

[小细节,大BUG]记录一些小问题引起的大BUG(长期更新....)

[小细节,大BUG]  1. 在不久前,一个朋友出现了这样一个BUG:当UITableView加载cell的时候,自定义的cell,怎么显示,里面的文字总是显示不完全(注意,文字不长).然后,我帮忙给看了下,甚至把在storyBoard中将cell的相关属性都试了下,虽然可以解决,但是效果不理想.最终经过排查,终于发现问题所在:当自定义cell时,因为需要布局子控件,所以他重写了layoutSubviews方法,然而在此方法中没有调用[super layoutSubviews],所以造成了布局混

CSS中em,rem的区别

首先这两个单位一般用在移动端 不太清楚得求证  再记录 1.em w3cschool中给出css中尺寸单位如下: 单位 描述 % 百分比 in 英寸 cm 厘米 mm 毫米 em 1em 等于当前的字体尺寸. 2em 等于当前字体尺寸的两倍. 例如,如果某元素以 12pt 显示,那么 2em 是24pt. 在 CSS 中,em 是非常有用的单位,因为它可以自动适应用户所使用的字体. ex 一个 ex 是一个字体的 x-height. (x-height 通常是字体尺寸的一半.) pt 磅 (1

随笔小记——css中的属性覆盖问题

今天写代码时遇到一个问题,贴图记录下: 问题关于li,最开始的时候,我css中写的是:.distination-Box .dist-list li{ width:55px; }这样来控制一级li的属性,但是最后一个li的属性却不能受之前li属性的影响,这里就产生了一个优先级的问题.最后发现当我把一级li的css这样写:.dist-list li{ width:55px;},最后一个li的css这样写:.distination-Box .distination-sec-Box{ width:100