围绕DIV与CSS [英] centering div with css
本文介绍了围绕DIV与CSS的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
这是代码片段从我的CSS文件
#centered {
位置：亲属;
文本对齐：中心;
宽度：50％;
保证金左：自动;
保证金权：汽车;
}
＃表{
文本对齐：中心;
字体大小：1.5em;
字体重量：900;
背景颜色：＃5E9DC8;
}
这是HTML部分，我想要使用：
＆LT;！DOCTYPE HTML PUBLIC - // W3C // DTD XHTML 1.0 Strict标准// EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;冠军＆GT;自行车存储数据库和LT; /标题＆GT;
＆LT;链接相对=样式类型=文/ CSS的href =web.css/＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; H1＆GT; ACME自行车店＆LT; / H1＆GT;
＆LT; H2＆GT;获取GEAR＆LT;！/ H＆GT;
＆LT; DIV ID =中心＆GT;
＆LT;表ID =表的边界=0的cellpadding =10＆GT;
＆其中; TR＆GT;
＆LT; TD＆GT;＆LT; A HREF =search_inv.php级=navTest＆GT;！去购物＆LT; / A＆GT;＆LT; BR /＆GT;＆LT; BR /＆GT;
＆LT; A HREF =search_service.html级=navTest＆GT;检查服务票据和LT; / A＆GT;＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; /表＆gt;
＆LT; / DIV＆GT;
＆LT; P＆GT;＆LT; BR /＆GT;＆LT; A HREF =的index.html＆GT; HOME＆LT; / A＆GT;＆LT; / P＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
这是结果：
我读过的一切表明，我已经正确地做到了这一点，但它偏离中心在我所有的浏览器。有什么想法？
<类=h2_linDIV>解决方案为什么你正在使用的表是什么？任何具体的原因是什么？你不能简单地做这样的？
＆LT; DIV CLASS =中心＆GT;
＆LT; A HREF =＃＆GT;去购物＆LT; / A＆GT;
＆LT; BR＆GT;
＆所述; A HREF =＃＆GT;＆所述; / a取代;
＆LT; / DIV＆GT;
。中央 {
保证金：汽车;
/ *其他款式放在这里，宽度高度背景等* /
}
This is the snippet from my css file
#centered{
position: relative;
text-align: center;
width: 50%;
margin-left: auto;
margin-right: auto;
}
#table{
text-align: center;
font-size: 1.5em;
font-weight: 900;
background-color: #5E9DC8;
}
This is the html section that I'm trying to use:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Bicycle Store Database</title>
<link rel="stylesheet" type="text/css" href="web.css" />
</head>
<body>
<h1>ACME BICYCLE SHOP</h1>
<h2>GET IN GEAR!</h2>
<div id="centered">
<table id="table" border="0" cellpadding="10">
<tr>
<td><a href="search_inv.php" class="navTest">Go Shopping!</a><br/><br/>
<a href="search_service.html" class="navTest">Check a Service Ticket</a></td>
</tr>
</table>
</div>
<p><br/><a href="index.html">HOME</a></p>
</body>
</html>
This is the result:
Everything I've read indicates that I've done this correctly, but it's off centered in all my browsers. Any thoughts?
解决方案
Why you are using table for that? any specific reason? Can't you simply do it like this?
<div class="center">
<a href="#">Go Shopping</a>
<br>
<a href="#"></a>
</div>
.center {
margin: auto;
/* Other styles goes here, width height background etc */
}
这篇关于围绕DIV与CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
