众所周知,在Firefox下input type=”button”的文字是不好居中的,原因在于Firefox自己比较二,弄了个私有属性,导致以下问题的出现: 按钮左右本身有2px的间距(FF私有属性写了padding:0 2px所致): 按钮文字居中是不行的(此时设置padding-bottom是没用的) : 等等… 1 input[type="reset"]::-moz-focus-inner, 2 input[type="button"]::-moz-focus…
之前本人一直使用浮动.相对定位.绝对定位和display:table等css的方法进行定位.网上得知flex可实现弹性布局,符合未来发展趋势,随尝试. 1:让盒子行内文字垂直居中,解决思路是讲文字的行高设置为盒子的高度. p { border:#333333 solid 1px; height:50px; line-height:50px; margin-bottom:30px; } 2:让盒子行内文字垂直居中,解决思路是对盒子的高度设定,然后对盒子的padding-top和padding-bo…
最近在写UI,或多或少用到了CSS,在这记录一下,今天用到的DIV内文字垂直居中的写法, 因为所做的项目都是基于WebKit内核浏览器演示的,所以我们今天采用的是-webkit-box的写法: display: -webkit-box; /* 水平居中*/ -webkit-box-align: center; /* 垂直居中 */ -webkit-box-pack: center; /*flex需要写上,不写没作用*/ -webkit-box-flex: 1; 上面这种写法适合高度不固定的情况.…
最近做demo时,经常需要div垂直居中或者让div内文字相对div垂直居中.水平居中比较简单,就不多说了,这里主要记录一下垂直居中的一些方法. 一.div垂直居中的一些方法: 1.当height.width固定大小时, <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>垂直居中</title> </head> <body>…
由于FireFox的刷新机制与IE有较大区别.所以javascript代码 document.location.reload();通常在IE上工作正常,在Firefox下效果却并不理想,这是因为Firefox会记录上一次的页面元素的值,所以我们常常会看见刷新页面后,旧的值却好保留在页面上. Tips: document.location.reload()相当于在Firefox上 按F5 来刷新,但 F5刷新 并不能清除缓存中被保留的页面元素的值.但我们可以用Ctrl+F5 来实现IE下F5的效果…
由于无法知道框内文字的高度,很难确定垂直空间的位置.vertical-align:middle仅对td元素有效,无论单行和多行均可实现垂直居中.…
在做网页兼容时 发现在ie8下的input内用padding失效 为了达到居中文字的效果 使用line-height可以解决问题…
一.在函数中传递event参数 在函数中传递event参数,这样我们就可以兼容IE和FF的event的获取了,如下面的函数: function _test(evt){    var src = evt.srcElement || evt.target; // 获取触发事件的源对象    alert(src.value); // 打印该对象的value属性} 那么我们在使用的时候就应该这样: <input type='button' value='click me' onclick='_test(…
<button style="cursor:pointer;vertical-align: middle;" >删除</button> 这时候垂直不居中. <button style="cursor:pointer;vertical-align: middle;height:21px;" >删除</button> 这时候垂直居中了.对它添加了height样式.…
给文字设置line-height,等于button高度.…