Admin Admin
Mesaj Sayısı : 1558Yaş : 38rep+ : Points : 2977Kayıt tarihi : 15/08/08 Konu: IE-Firefox arasındaki farklar için Reset.css Ptsi Eyl. 14, 2009 2:05 pm Benim gibi HTML / XHTML arayüz kodlama yapan kişilerin; IE ve Firefox arasınki farklılık herzaman canını sıkmıştır.
Reset.css yada ieHack kullanarak fix etmek mümkün fakat gerek impression gerekse performans açısından, css tag'larına default değer vermek en sağlıklı
yol olacaktır.
Bu konuda oluşturduğum css modelinin üzerinden layout'a devam edebilirsiniz.
alıntıdır...
Kod: [table][tr][td]/*=========================================================================== */ [/td][/tr][tr][td]/* CSS Document Stylesheet [/td][/tr][tr][td]============================================================================= */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> RESET CSS [/td][/tr][tr][td]/* ============================w============================================= */ [/td][/tr][tr][td] [/td][/tr][tr][td]/*reset.css*/ [/td][/tr][tr][td]body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;} [/td][/tr][tr][td]table{border-collapse:collapse;border-spacing:0;} [/td][/tr][tr][td]fieldset,img{border:0;} [/td][/tr][tr][td]address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;} [/td][/tr][tr][td]ol,ul {list-style:none;} [/td][/tr][tr][td]caption,th {text-align:left;} [/td][/tr][tr][td]h1,h2,h3,h4,h5,h6{font-size:11px;font-weight:normal;} [/td][/tr][tr][td]q:before,q:after{content:'';} [/td][/tr][tr][td]abbr,acronym {border:0;} [/td][/tr][tr][td] [/td][/tr][tr][td]/*fonts.css*/ [/td][/tr][tr][td]body{font-size:11px; font-family:Tahoma,Arial;color:#333333;} [/td][/tr][tr][td]select, input, textarea {font-size:11px; font-family:Tahoma,Arial;} [/td][/tr][tr][td]body * {line-height:16px;} [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> BOX CONTROL [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td].aCenter { text-align:center; } [/td][/tr][tr][td].aRight { text-align:right; } [/td][/tr][tr][td].aLeft { text-align:left;} [/td][/tr][tr][td].vCenter { vertical-align:middle; } [/td][/tr][tr][td].vTop { vertical-align:top; } [/td][/tr][tr][td].vBottom { vertical-align:bottom; } [/td][/tr][tr][td].vTopLeft { vertical-align:top; text-align:left; } [/td][/tr][tr][td] [/td][/tr][tr][td].clear { clear:both; } [/td][/tr][tr][td].fLeft { float:left; } [/td][/tr][tr][td].fRight { float:right; } [/td][/tr][tr][td].fix { display:block; } [/td][/tr][tr][td].posab { position:absolute; } [/td][/tr][tr][td].b { font-weight:bold; } [/td][/tr][tr][td].pointer { cursor:pointer; } [/td][/tr][tr][td].noBorder { border-color:transparent; } [/td][/tr][tr][td].noBG { background:transparent; } [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> FORM OBJECT STARTING [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td]input {border:1px solid #d6d6d6; font-family:"lucida grande",tahoma,verdana,arial,sans-serif; font-size:11px; padding:4px; } [/td][/tr][tr][td]input:hover {border:#dcb56b 1px solid} [/td][/tr][tr][td].button {background:#000 none repeat scroll 0%;border:1px solid #494949;color:#fff;font-family:Tahoma, Arial; [/td][/tr][tr][td]font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;line-height:normal; padding:2px 4px 2px 4px; cursor:pointer} [/td][/tr][tr][td].button:hover { background:#494949; } [/td][/tr][tr][td] [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> WİDTH STARTING [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td].w5 { width:5px; } [/td][/tr][tr][td].w10 { width:10px; } [/td][/tr][tr][td].w15 { width:15px; } [/td][/tr][tr][td].w20 { width:20px; } [/td][/tr][tr][td].w25 { width:25px; } [/td][/tr][tr][td].w30 { width:30px; } [/td][/tr][tr][td].w35 { width:35px; } [/td][/tr][tr][td].w40 { width:40px; } [/td][/tr][tr][td].w45 { width:45px; } [/td][/tr][tr][td].w50 { width:50px; } [/td][/tr][tr][td].w60 { width:60px; } [/td][/tr][tr][td].w70 { width:70px; } [/td][/tr][tr][td].w80 { width:80px; } [/td][/tr][tr][td].w90 { width:90px; } [/td][/tr][tr][td].w100 { width:100px; } [/td][/tr][tr][td].w125 { width:125px; } [/td][/tr][tr][td].w150 { width:150px; } [/td][/tr][tr][td].w175 { width:175px; } [/td][/tr][tr][td].w190 { width:190px; } [/td][/tr][tr][td].w200 { width:200px; } [/td][/tr][tr][td].w210 { width:210px; } [/td][/tr][tr][td].w215 { width:215px; } [/td][/tr][tr][td].w225 { width:225px; } [/td][/tr][tr][td].w250 { width:250px; } [/td][/tr][tr][td].w275 { width:275px; } [/td][/tr][tr][td].w300 { width:300px; } [/td][/tr][tr][td].w350 { width:350px; } [/td][/tr][tr][td].w400 { width:400px; } [/td][/tr][tr][td].w450 { width:450px; } [/td][/tr][tr][td].w500 { width:500px; } [/td][/tr][tr][td].w550 { width:550px; } [/td][/tr][tr][td].w600 { width:600px; } [/td][/tr][tr][td].w700 { width:700px; } [/td][/tr][tr][td].w750 { width:750px; } [/td][/tr][tr][td].w760 { width:760px; } [/td][/tr][tr][td].w900 { width:900px; } [/td][/tr][tr][td].wauto { width:auto; } [/td][/tr][tr][td]/* Width end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> HEIGHT STARTING [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td].h5 { height:5px; } [/td][/tr][tr][td].h10 { height:10px; } [/td][/tr][tr][td].h15 { height:15px; } [/td][/tr][tr][td].h20 { height:20px; } [/td][/tr][tr][td].h25 { height:25px; } [/td][/tr][tr][td].h30 { height:30px; } [/td][/tr][tr][td].h35 { height:35px; } [/td][/tr][tr][td].h40 { height:40px; } [/td][/tr][tr][td].h45 { height:45px; } [/td][/tr][tr][td].h50 { height:50px; } [/td][/tr][tr][td].h75 { height:75px; } [/td][/tr][tr][td].h85 { height:85px; } [/td][/tr][tr][td].h100 { height:100px; } [/td][/tr][tr][td].h125 { height:125px; } [/td][/tr][tr][td].h150 { height:150px; } [/td][/tr][tr][td].h175 { height:175px; } [/td][/tr][tr][td].h200 { height:200px; } [/td][/tr][tr][td]/* height end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> PADDING STARTING [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* padding style start */ [/td][/tr][tr][td].nopad {padding:0px; } [/td][/tr][tr][td].pad1 {padding:1px; } [/td][/tr][tr][td].pad2 {padding:2px; } [/td][/tr][tr][td].pad3 {padding:3px; } [/td][/tr][tr][td].pad4 {padding:4px; } [/td][/tr][tr][td].pad5 {padding:5px; } [/td][/tr][tr][td].pad10 {padding:10px; } [/td][/tr][tr][td].pad15 {padding:15px; } [/td][/tr][tr][td]/* padding style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* padding-left style start */ [/td][/tr][tr][td].padL1 {padding-left:1px; } [/td][/tr][tr][td].padL2 {padding-left:2px; } [/td][/tr][tr][td].padL3 {padding-left:3px; } [/td][/tr][tr][td].padL4 {padding-left:4px; } [/td][/tr][tr][td].padL5 {padding-left:5px; } [/td][/tr][tr][td].padL10 {padding-left:10px; } [/td][/tr][tr][td].padL15 {padding-left:15px; } [/td][/tr][tr][td].padL20 {padding-left:20px; } [/td][/tr][tr][td]/* padding-left style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* padding-right style start */ [/td][/tr][tr][td].padR1 {padding-right:1px; } [/td][/tr][tr][td].padR2 {padding-right:2px; } [/td][/tr][tr][td].padR3 {padding-right:3px; } [/td][/tr][tr][td].padR4 {padding-right:4px; } [/td][/tr][tr][td].padR5 {padding-right:5px; } [/td][/tr][tr][td].padR10 {padding-right:10px; } [/td][/tr][tr][td].padR15 {padding-right:15px; } [/td][/tr][tr][td].padR20 {padding-right:20px; } [/td][/tr][tr][td]/* padding-right style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* padding-top style start */ [/td][/tr][tr][td].padT1 {padding-top:1px; } [/td][/tr][tr][td].padT2 {padding-top:2px; } [/td][/tr][tr][td].padT3 {padding-top:3px; } [/td][/tr][tr][td].padT4 {padding-top:4px; } [/td][/tr][tr][td].padT5 {padding-top:5px; } [/td][/tr][tr][td].padT7 {padding-top:7px; } [/td][/tr][tr][td].padT10 {padding-top:10px; } [/td][/tr][tr][td].padT15 {padding-top:15px; } [/td][/tr][tr][td].padT20 {padding-top:20px; } [/td][/tr][tr][td]/* padding-top style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* padding-bottom style start */ [/td][/tr][tr][td].padB1 {padding-bottom:1px; } [/td][/tr][tr][td].padB2 {padding-bottom:2px; } [/td][/tr][tr][td].padB3 {padding-bottom:3px; } [/td][/tr][tr][td].padB4 {padding-bottom:4px; } [/td][/tr][tr][td].padB5 {padding-bottom:5px; } [/td][/tr][tr][td].padB10 {padding-bottom:10px; } [/td][/tr][tr][td].padB15 {padding-bottom:15px; } [/td][/tr][tr][td]/* padding-bottom style start */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* PADDING END */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td]/* ---------->>> MARGIN STARTING [/td][/tr][tr][td]/* ========================================================================== */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin style start */ [/td][/tr][tr][td].marLRauto { margin-left:auto; margin-right:auto; } [/td][/tr][tr][td].nomar {margin:0px; } [/td][/tr][tr][td].mar1 {margin:1px; } [/td][/tr][tr][td].mar2 {margin:2px; } [/td][/tr][tr][td].mar3 {margin:3px; } [/td][/tr][tr][td].mar4 {margin:4px; } [/td][/tr][tr][td].mar5 {margin:5px; } [/td][/tr][tr][td].mar6 {margin:6px; } [/td][/tr][tr][td].mar10 {margin:10px; } [/td][/tr][tr][td].mar15 {margin:15px; } [/td][/tr][tr][td].mar30 {margin:30px; } [/td][/tr][tr][td]/* margin style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin-left style start */ [/td][/tr][tr][td].marL1 {margin-left:1px; } [/td][/tr][tr][td].marL2 {margin-left:2px; } [/td][/tr][tr][td].marL3 {margin-left:3px; } [/td][/tr][tr][td].marL4 {margin-left:4px; } [/td][/tr][tr][td].marL5 {margin-left:5px; } [/td][/tr][tr][td].marL10 {margin-left:10px; } [/td][/tr][tr][td].marL15 {margin-left:15px; } [/td][/tr][tr][td].marL20 {margin-left:20px; } [/td][/tr][tr][td].marL30 {margin-left:30px; } [/td][/tr][tr][td].marL40 {margin-left:40px; } [/td][/tr][tr][td].marL100 {margin-left:100px; } [/td][/tr][tr][td]/* margin-left style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin-right style start */ [/td][/tr][tr][td].marR1 {margin-right:1px; } [/td][/tr][tr][td].marR2 {margin-right:2px; } [/td][/tr][tr][td].marR3 {margin-right:3px; } [/td][/tr][tr][td].marR4 {margin-right:4px; } [/td][/tr][tr][td].marR5 {margin-right:5px; } [/td][/tr][tr][td].marR7 {margin-right:7px; } [/td][/tr][tr][td].marR10 {margin-right:10px; } [/td][/tr][tr][td].marR15 {margin-right:15px; } [/td][/tr][tr][td].marR20 {margin-right:20px; } [/td][/tr][tr][td]/* margin-right style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin-top style start */ [/td][/tr][tr][td].marT1 {margin-top:1px; } [/td][/tr][tr][td].marT2 {margin-top:2px; } [/td][/tr][tr][td].marT3 {margin-top:3px; } [/td][/tr][tr][td].marT4 {margin-top:4px; } [/td][/tr][tr][td].marT5 {margin-top:5px; } [/td][/tr][tr][td].marT10 {margin-top:10px; } [/td][/tr][tr][td].marT15 {margin-top:15px; } [/td][/tr][tr][td].marT20 {margin-top:20px; } [/td][/tr][tr][td]/* margin-top style end */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin-bottom style start */ [/td][/tr][tr][td].marB1 {margin-bottom:1px; } [/td][/tr][tr][td].marB2 {margin-bottom:2px; } [/td][/tr][tr][td].marB3 {margin-bottom:3px; } [/td][/tr][tr][td].marB4 {margin-bottom:4px; } [/td][/tr][tr][td].marB5 {margin-bottom:5px; } [/td][/tr][tr][td].marB10 {margin-bottom:10px; } [/td][/tr][tr][td].marB15 {margin-bottom:15px; } [/td][/tr][tr][td]/* margin-bottom style start */ [/td][/tr][tr][td] [/td][/tr][tr][td]/* margin END */[/td][/tr][/table][table width="100%"][tr class="cursor_hidden"][td] [/td][/tr][/table]