Mybb Tarzı Giriş Kısmı Modelersiz

.panel {
width: 530px;
margin: auto auto;
}
.panel label input#nick {/*Nick iletisim kutusu*/
padding: 4px 4px 4px 20px;
border: 2px solid #ccc;
background: #EEE url(http://img.webme.com/pic/o/odevst/giris1.png) 2px center no-repeat;
color: #6F6F6F;
width: 150px;
font:bold 12px "Lucida Grande", Arial, sans-serif;
}
.panel label input#nick:focus {/*Nick iletisim kutusu SECILI*/
background: #EFF5FF url(http://img.webme.com/pic/o/odevst/giris2.png) 2px center no-repeat;
border: 2px solid #73A6FF;
color: #000;
}
.panel label {/* Aciklama pozuzyonu*/
position: relative;
}
.panel label#nick span {/* Aciklama gizli */
padding-top: 5px;
display: none;
color: #FFF;
height: 27px;
width: 106px;
text-align: center;
font:bold 11px "Lucida Grande", Arial, sans-serif;
}
.panel label#nick:hover span {/* Aciklama goronur*/
display: block;
position: absolute;
background: url(http://img.webme.com/pic/o/odevst/giris3.png) left 0px no-repeat;
top: -38px;
left: 40px;
}

.panel label input#sifre { /*Sifre iletisim kutusu*/
padding: 4px 4px 4px 20px;
border: 2px solid #ccc;
background: #EEE url(http://img.webme.com/pic/o/odevst/giris4.png) 2px center no-repeat;
color: #6F6F6F;
width: 150px;
font:bold 12px "Lucida Grande", Arial, sans-serif;
}
.panel label input#sifre:focus {/*Sifre iletisim kutusu SECILI*/
background: #EFF5FF url(http://img.webme.com/pic/o/odevst/giris4.png) 2px center no-repeat;
border: 2px solid #73A6FF;
color: #000;
}
.panel label#sifre span { /* Aciklama gizli */
padding-top: 5px;
display: none;
color: #FFF;
height: 27px;
width: 106px;
text-align: center;
font:bold 11px "Lucida Grande", Arial, sans-serif;
}
.panel label#sifre:hover span {/* Aciklama goronur*/
display: block;
position: absolute;
background: url(http://img.webme.com/pic/o/odevst/giris3.png) left 0px no-repeat;
top: -38px;
left: 40px;
}

.buton {/*Giris Buton*/
padding: 4px 4px 4px 18px;
height: 26px;
background: #eee url(http://img.webme.com/pic/o/odevst/giris1.png) 2px center no-repeat;
border: 2px solid #ccc;
cursor: pointer;
margin-top: 2px;
font:bold 11px "Lucida Grande", Arial, sans-serif;
}
.buton:hover { /*Giris Buton Hover*/
background: #EFF5FF url(http://img.webme.com/pic/o/odevst/giris1.png) 2px center no-repeat;
border: 2px solid #73a6ff;
}

<style>
div#giris1{
position:absolute;
top:123px;
left:443px;
}
div.giris2{
background-image: url();
background-repeat: no-repeat;
width:400px;
height:95px;
padding-top:18px;
padding-left:15px;
}
</style><div class="giris2" id=giris1>
<form action="/login.forum" method="post" name="form_login">
    <div class="panel"><label for="username" id="nick"><input class="post" size="10" name="username" type="text" gtbfieldid="1" id="nick" /><span>Kullanıcı Adınız</span></label> <label for="password" id="sifre"><input class="post" size="10" name="password" type="password" id="sifre" /><span>Şifreniz</span></label> <input class="buton" name="login" value="Giriş" type="submit" /></div>
</form>
</div>