CSS thẻ Div P.1

1. Canh giữa thẻ div kiểu 1 :
 
<style>
.box{
background:#333;
width:400px;
height:400px;
padding:10px;
color:#fff;
margin:0 auto;
position:relative;
}

.box img{
margin:auto;
position:absolute;
top:0; left:0; right:0; bottom:0;
}
</style>
<div class="box">
<img src="link hình" >
</div>

2. Canh giữa thẻ div kiểu 2 :

<style>
* {margin:0;padding:0}
#container {
border: 2px solid blue;
position: relative;
width: 400px;
height: 300px;
background: url(http://i2.wp.com/webfaver.com/wp-content/uploads/2015/07/square.png) no-repeat center center;
}
#box {
border: 2px solid red;
position: absolute;
width: 80px;
height: 160px;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
}
</style>
<div id="container">
<div id="box"></div>
</div>

3. Canh giữa thẻ div kiểu 3 :

<style>
#outer {
display: block;
/* border */
border: 1px solid red;
}
#inner {
margin: 0 auto;
/* border & width */
border: 1px solid #333
width: 100px;
}
</style>
<div id="outer" style="border: 1px solid red;">
<div id="inner" style="border: 1px solid #333; width: 100px">Inner</div>
</div>

MỤC LỤC: Nội dung bài viết

• Mẫu HTML - CSS
• Mẫu javascript