<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;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.