Kadang kita masih bingung, bagaimana cara menengahkan layer / div yang kita buat,
ternyata caranya cukup sederhana,
kita tinggal menambahkan beberapa script saja di css,
bisa sebagai id ataupun class,,
ini contoh screenshot nya :
ini kode htmlnya :
<html>
<head>
<title>div berada di tengah</title>
<style type="text/css">
.tengah{
position:absolute;
margin-left:auto;
margin-right:auto;
margin-top:auto;
margin-bottom:auto;
left:0;
right:0;
top:0;
bottom:0;
}
</style>
</head>
<body>
<div style="background-color:#0CF; width:300px; height:300px;">
ini div yang tidak ditengahkan
</div>
<div class="tengah" style="background-color:#F00; width:300px; height:300px;">
ini adalah div yang ditengahkan
</div>
</body>
</html>
ternyata caranya cukup sederhana,
kita tinggal menambahkan beberapa script saja di css,
bisa sebagai id ataupun class,,
ini contoh screenshot nya :
ini kode htmlnya :
<html>
<head>
<title>div berada di tengah</title>
<style type="text/css">
.tengah{
position:absolute;
margin-left:auto;
margin-right:auto;
margin-top:auto;
margin-bottom:auto;
left:0;
right:0;
top:0;
bottom:0;
}
</style>
</head>
<body>
<div style="background-color:#0CF; width:300px; height:300px;">
ini div yang tidak ditengahkan
</div>
<div class="tengah" style="background-color:#F00; width:300px; height:300px;">
ini adalah div yang ditengahkan
</div>
</body>
</html>
Tidak ada komentar:
Posting Komentar