问题：一段时间以来，发觉div+css居中问题越来越被关注了，看了几个博客，果断验证了一下；
解决方案：图片：见附件，我测试了ie10和chrome27.0.1453.12
方案一：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link type="text/css" href="css/div-css-center1.css" rel="stylesheet" />
</head>
<body>
<div id="wrapper">
<div id="cell">
<div class="content">Content goes here</div>
</div>
</div>
</body>
</html>
css:代码：
@CHARSET "UTF-8";
body {
background-color: gray;
}
#wraper {
display: table;
}
#cell {
display: table-cell;
vertical-align: middle;
background-color: white;
}??
方案二
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link type="text/css" href="css/div-css-center2.css" rel="stylesheet" />
</head>
<body>
<div class="content">Content goes here</div>
</body>
</html>
css代码：
@CHARSET "UTF-8";
body {
background-color: gray;
text-align: center;
}
#content,.content {
position: absolute;
top: 50%;
/* left: 50%; */
/* width: 500px; */
height: 240px;
margin-top: -120px;
text-align: center;
background-color: white;
height: 240px;
height: 240px;
}
?
?方案三：
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link type="text/css" href="css/div-css-center3.css" rel="stylesheet" />
</head>
<body>
<div id="floater"></div>
<div id="content">Content here</div>
</body>
</html>
css代码：
@CHARSET "UTF-8";
body {
background-color: gray;
}
#floater {
float: left;
height: 50%;
margin-bottom: -120px;
}
.content,#content {
clear: both;
height: 240px;
position: relative;
background-color: white;
}
?方案四：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link type="text/css" href="css/div-css-center4.css" rel="stylesheet" />
</head>
<body>
<div id="content">Content here</div>
</body>
</html>
css代码：
@CHARSET "UTF-8";
body {
background-color: gray;
}
.content,#content {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
height: 240px;
width: 200px;
background-color: white;
}
方案五：
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/
