margin

DIV+CSS圆角边框

由 我的梦境 提交于 2019-12-21 21:04:16
简洁型css圆角： 方法1： 简洁型css圆角矩形 code1: < style type ="text/css" > .b1,.b2,.b3,.b4,.b1b,.b2b,.b3b,.b4b,.b { display : block ; overflow : hidden ; } .b1,.b2,.b3,.b1b,.b2b,.b3b { height : 1px ; } .b2,.b3,.b4,.b2b,.b3b,.b4b,.b { border-left : 1px solid #999 ; border-right : 1px solid #999 ; } .b1,.b1b { margin : 0 5px ; background : #999 ; } .b2,.b2b { margin : 0 3px ; border-width : 2px ; } .b3,.b3b { margin : 0 2px ; } .b4,.b4b { height : 2px ; margin : 0 1px ; } .d1 { background : #F7F8F9 ; } .k { height : 300px ; } </ style > </ head > < body > < div > < b class ="b1" ></ b >< b class ="b2 d1" ></ b

Margin Discrepancies between Firefox and Chrome/Safari

由 一世执手 提交于 2019-12-21 20:16:28
问题 I seem to have a slight issue with some spacing in between my lines between Firefox and Safari/Chrome. This first image is how the links on the left, and the line of text after the table on the bottom are supposed to look like: How webpage looks in Safari/Chrome As you can see, the links are lined up well with the rectangle "first genesis group" logo. This is how it looks in firefox As you can see, the links are a bit stretched vertical on the left, thus somehow causing the bottom line to

Why is Safari 4 / mac not rendering top and bottom margins in this nested div?

由 丶灬走出姿态 提交于 2019-12-21 19:27:43
问题 Safari 4 seems to be ignoring element margins unless I add a border. The following example renders left and right margins but no top or bottom. Upon adding a border, it renders as expected. Am I doing something wrong or am I going to have to add borders (albeit transparent ones) to every element with margins just for Safari? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta

How do I add a margin outside the border of a component in Swing?

由 霸气de小男生 提交于 2019-12-21 12:08:10
问题 I use multiple components that has a border painted. Is there any easy way to add a margin to the component so that the borders aren't painted so close to eachother? 回答1: This is typically done using your layout manager. For example, if you are using GridBagLayout , you would set insets on the GridBagConstraint object to the desired value. Another option is to use the Box object and add a horizontal or vertical struct. See javadoc for Box.createVerticalStrut( int width ) and the similar

什么是BFC

由 旧城冷巷雨未停 提交于 2019-12-21 11:36:44
写CSS样式时，对一个元素设置css,我们首先要知道这个元素是块级元素还是行内元素，而BFC就是用来格式化块级盒子的。 BFC定义： 块级格式化上下文，它是指一个独立的块级渲染区域，只有Block-level Box参与，该区域拥有一套渲染规则来约束块级盒子的布局，且与区域外部无关。 满足下列CSS声明之一的元素便会生成BFC： 1.根元素或其它包含它的元素 2.float的值不为none； 3.overflow的值不为visible； 4.position的值不为static； 5.display的值为inline-block、table-cell、table-caption； 6.flex boxes (元素的display: flex或inline-flex) BFC的布局规则是什么样的呢？ 1、内部的元素会在垂直方向一个接一个地排列，可以理解为是BFC中的一个常规流 2、元素垂直方向的距离由margin决定，即属于同一个BFC的两个相邻盒子的margin可能会发生重叠 3、每个元素的左外边距与包含块的左边界相接触(从左往右，否则相反)，即使存在浮动也是如此，这说明BFC中的子元素不会超出它的包含块 4、BFC的区域不会与float元素区域重叠 5、计算BFC的高度时，浮动子元素也参与计算 6、BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素

How to slide in divs from off screen into absolute layout using CSS transitions?

由 半城伤御伤魂 提交于 2019-12-21 11:24:21
问题 I have a grid of absolutely positioned divs (the grid is made up of differently shaped rectangles that fit together to make a large rectangle). I am trying to animate the display of this grid by having all of the individual rectangles 'fly' into the grid from offscreen. So the rectangles on the left fly in from the left, the ones on the right from the right etc. I am using CSS3 transitions and when flying in from the top or left it works perfectly, I just use negative margins to position them

IE8 - Container with margin-top: 10px has no margin

由 青春壹個敷衍的年華 提交于 2019-12-21 11:24:01
问题 EDIT: This happens only in IE8, it works fine in IE7, Firefox, Opera etc First of all, here is a picture I have made in photoshop to demonstrate my problem: http://richardknop.com/pict.jpg Now you should have idea about my issue. Here is a simplified version of markup I'm using (I left out most irrelevant content): <div class="left"> <div class="box"> // box content </div> <div class="box"> // box content </div> <div class="box"> // box content </div> </div> <div class="right"> <div class=

CSS面试题整理

由 a 夏天 提交于 2019-12-21 09:16:20
Css篇： 1.有哪项方式可以对一个DOM设置它的CSS样式？　 　 外部样式表，引入一个外部css文件 内部样式表，将css代码放在 <head> 标签内部 内联样式，将css样式直接定义在 HTML 元素内部 2.CSS都有哪些选择器？ 派生选择器（用HTML标签申明） id选择器（用DOM的ID申明） 类选择器（用一个样式类名申明） 还有一些扩展选择器。 后代选择器（利用空格间隔，比如div .a{ }） 群组选择器（利用逗号间隔，比如p,div,#a{ }） 　 CSS选择器的优先级是怎么样定义的？ 用1表示派生选择器的优先级 用10表示类选择器的优先级 用100标示ID选择器的优先级 div.test1 .span var 优先级 1+10 +10 +1 span#xxx .songs li 优先级1+100 + 10 + 1 #xxx li 优先级 100 +1 3.CSS中可以通过哪些属性定义，使得一个DOM元素不显示在浏览器可视范围内？　　 　　最基本的： 　　设置display属性为none，或者设置visibility属性为hidden 　　技巧性： 　　设置宽高为0，设置透明度为0，设置z-index位置在-1000 4.超链接访问过后hover样式就不出现的问题是什么？如何解决？ 答案：被点击访问过的超链接样式不在具有hover和active了

Browser user agent style sheet margin 8px

由 不羁岁月 提交于 2019-12-21 07:56:32
问题 I was just wonerdering about a white space all around a website. I found out it is there because of the user agent style sheet (Google Chrome) and there is set a margin of 8px to the body tag as default. How to solve this is not a problem, but I am interested in the reason of this margin. I searched for it, but I only find solutions to set the margin zero, but I want to know why this margin is there. Hope you can tell me more about these user agent stylesheets. Greetings Philipp 回答1: Browsers

Margin: Auto not working in IE

由 做~自己de王妃 提交于 2019-12-21 07:15:08
问题 URL: http://cyberbat.co.uk/test container margin: auto is not working, is there any other way to put it in the middle in IE. EDIT: Check it again, the index.php was the wrong file, I replaced it with index.html . 回答1: This is a bug in IE! You just need to create a holder for <div class="page"> and set its text-align to center .page-holder{ text-align:center; } .page{ margin:0 auto; } <div class="page-holder"> <div class="page"> page content </div> </div> 回答2: <!DOCTYPE HTML PUBLIC "-//W3C/
订阅 margin