Material Temalı Butonda Yazı Sorunu


TheLastRevolution

TheLastRevolution

Üye
    Konu Sahibi


yukarıdaki resimde gördüğünüz butonda yazan deneme yazısını butonun ortasına yerleştirmeye çalışıyorum ama bir türlü olmuyor yardım edebilecek olan var mı buyrun bunlarda kaynak kodları;

BUTON KODU ( .CSS DOSYASI )​
HTML:
body{
margin:0;
padding:0;
}



.wrapper:after {
    content:"";
    display:table;
    clear:both;
}

.ripplelink{
  display:block;
  width:49.6%;
  margin:0.2%;
  height:10em;
  text-align: center;
  color:#fff;
  text-decoration:none;
  position:relative;
  overflow:hidden;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index:0;
  background: #0c5e58;
}

.ripplelink:hover{
    z-index:1000;
  box-shadow:rgba(0, 0, 0, 0.3) 0 16px 16px 0;
  -webkit-box-shadow:rgba(0, 0, 0, 0.3) 0 16px 16px 0;
  -moz-box-shadow:rgba(0, 0, 0, 0.3) 0 16px 16px 0;
  text-shadow: 3px 3px 1px #000;
  color: yellow;
  text-decoration:none;
}

.ink {
  display: block;
  position: absolute;
  background:rgba(255, 255, 255, 0.3);
  border-radius: 100%;
  -webkit-transform:scale(0);
     -moz-transform:scale(0);
       -o-transform:scale(0);
          transform:scale(0);
}

.animate {
    -webkit-animation:ripple 0.65s linear;
   -moz-animation:ripple 0.65s linear;
    -ms-animation:ripple 0.65s linear;
     -o-animation:ripple 0.65s linear;
        animation:ripple 0.65s linear;
}

@-webkit-keyframes ripple {
    100% {opacity: 0; -webkit-transform: scale(2.5);}
}
@-moz-keyframes ripple {
    100% {opacity: 0; -moz-transform: scale(2.5);}
}
@-o-keyframes ripple {
    100% {opacity: 0; -o-transform: scale(2.5);}
}
@keyframes ripple {
    100% {opacity: 0; transform: scale(2.5);}
}


.cyan{
  background:#00bcd4;
}

.lightgreen{
  background:#8bc34a;
}

.amber{
  background:#ffc107;
}

.orange{
  background:#ff9800;
}
SAYFANIN KODU ( .HTML DOSYASI ) ;
HTML:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="button.css" type="text/css">
<link rel="stylesheet" href="font.css" type="text/css">
<script type="text/javascript" src="buttoneffect.js"></script>

<BODY>

<a href="mcpe.html" style="text-decoration:none;">
<span class="ripplelink" style="width: 15%; height: 10%; font-family: minecraftiaregular;">DENEME</span>
</a>

</BODY>
arkadaslar yardimci olabilecek yok mu bi.uygulama yapmaya calisiyoruz ama burada takildik...
 




MaxiCep.com internet sitesi 5651 Sayılı Kanun’un 2. maddesinin 1. fıkrasının m) bendi ile aynı kanunun 5. maddesi kapsamında BTK kurumu tarafından onaylı Yer Sağlayıcı olarak faaliyet göstermektedir. İçerikler, ön onay olmaksızın tamamen kullanıcılar tarafından oluşturulmaktadır.

MaxiCep.com; Yer sağlayıcı olarak, kullanıcılar tarafından oluşturulan içeriği ya da hukuka aykırı paylaşımı kontrol etmekle ya da araştırmakla yükümlü değildir.

MaxiCep.com’un yer sağladığı içeriğin 5651 Sayılı Kanun’un 8 ila 9. maddelerine aykırı şekilde; kişilik haklarınızı ihlal ettiğini ya da hukuka aykırı olduğunu düşünüyorsanız Buradan yada [email protected] mail adresine e-mail göndererek iletişime geçerek bildirebilirsiniz.

Bildirimleriniz dikkatle ve özenle incelenmekte olup kişilik haklarınızın ihlali ya da hukuka aykırılığın tespiti halinde mevzuat kapsamında en kısa sürede işlem yaparak bilgi vereceğiz.
Üst Alt