<div id="container">
<div class="text">
<h1>Align-Items Kullanıyorum</h1>
<h3>align-items kullanarak dikey ortalama yapıyorum...</h3>
</div>
</div>
#container{
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
background:url(http://i.hizliresim.com/vXldZO.png);
width:600px;
margin:0 auto;
height:400px;
text-align:center;
color:#fff;
}
.text{
position: relative;
top: 50%;
transform: perspective(1px) translateY(-50%);
padding:20px;
}
h1, h3{
text-align:center;
margin:0;
text-shadow: 1px 1px 3px #333;
font-family:monospace, arial, helvetica;
padding:0px 30px 0px 30px;
}
h1{
letter-spacing:2px;
margin-bottom:10px;
line-height:38px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.