【技术】css常见问题

问题一：

Ie下input框中光标不居中？

在样式中设置height和line-height值一样，

.content input

{

height: 31px;

line-height: 31px;

}

 

问题二：

Firefox的3D视图中，层大小不一？

设置有问题层的height和width的值，并写display:inline-block;

.join-btn

{

height: 38px;

width: 142px;

display:inline-block;

}

 

问题三：

Ie下margin-bottom: 25px;失效？

IE下margin-bottom无效一般出现在容器里某元素设置后在父容器内无效，在父容器中加入以下两句css，基本上所有的浏览器都兼容了：overflow:hidden;zoom:100%;

article{

overflow:hidden;zoom:100%;

}

 

问题四：

body里不能写width，不能如下

body{
width:1960px; }

 

 

问题五：

美工给的背景图过宽，造成屏幕有滚动条？

html,body{
position: relative;
overflow-x:hidden;
overflow-y:auto;}

这样，宽度和屏幕一样，长度随内容变化。

 

 问题六：

文本的水平对齐方式text-align:left或者text-align:right失效？

用firefox的firebug看下是不是哪里写了text-align:center;而此处的标签存在继承关系。

 

 

 问题七：

电脑不是宽屏的或者浏览器没有最大化时，出现下面情况，

1.页面头部中心位置和内容中心位置横向错位？

原代码为

article{
border:1px #6e0e17 solid;
border-top: transparent;
background: #fff;
width: 1000px;
margin-top:-55px;
margin-bottom: 25px;
margin-left: 480px;
padding-bottom: 25px;}

改后代码为

article{
border:1px #6e0e17 solid;
border-top: transparent;
background: #fff;
width: 1000px;
margin:-55px auto 0;
padding-bottom: 25px;}

 

其中margin:-55px auto 0;为

margin-top: -55px;
margin-right-value: auto;
margin-bottom: 0px;
margin-left-value: auto;

 

2.页面不居中？

原代码为

.header{
overflow-x:hidden;
height: 512px;
background: url('images/head.gif') no-repeat;}

 

改后代码为

.header{
overflow-x:hidden;
height: 512px;
background: url('../images/head.gif') no-repeat top center;}