arkadaşlar bir portal sitesi hazırlıyorum, opera'yı kullanıyorum. Siteye operadan bakınca oh ne güzel, bide ınternet explorer'den girince kaymalar oluyor. bazı css kodları çalışmıyor. BU genel bir sorunmuş, ben şimdi ınternet explorer de düzgün görünmesi için ne yapmalıyım?
Windows'un sitesinden güncel olan exp. indir eski sürümlerde yaşanıyor bu olay genelde.
birincisiarkadaşın dediği gibi yap iincisi sayfanın formatını xhtml değil html üzerinden yap o zamn telefonlarda bile birebir aynı görünür
kardeş ben indirmesine indiririm, orada bir sorun yok. Ama siteye giren ziyaretçiler demi indirecek? başkaları bunu nasıl hallediyor?
zaten artık google chrom kullanılıyor ona gir onda düzgünse sorun yok
CSS reset kullan,,,
ben en son olarak bunu kullanmıştım. işimi görüyor,, explorer 6 dan 9 kadar , problem yaratmıyor..chrom mozilla ve diğer tarayıcılarla aynı hizaya getiriyor,,kodları css stil dosyanın başladığı yerden stillerine başlamadan koy, ve sürekli dene, çünkü stil farkınıda eklemen gerekicek , onun için en baştan stillerinin başladığı css 'in en üstüne yerleştir..zaten css reset makalelerindede bunları okursun..inşallah işe yarar, kolay gelsin.
kaynak : www.aydinmahmut.com/cssde-kullanilan-reset-css-nedir/
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 " 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
bu alandan sonra div yazı veya diğer veya stil tanımlamalarına buradan devam ediyorsun,
iyi akşamlar
unumadan yinede hatırlatmak istedim,,
head tagının içine bu koduda yerleştir..
<head>
<link rel="stylesheet" type="text/css" href="reset.css" />
</head>
CSS reset kullan,,,kardeş denedim ama olmadı. adres bu: http://celebimutfak.com/mudur bu adresten ınternet explorer la bi gir. bide chrome veya firefox gibi bi taraycı ile gir demek istediğimi anlıcaksınız.ben en son olarak bunu kullanmıştım. işimi görüyor,, explorer 6 dan 9 kadar , problem yaratmıyor..chrom mozilla ve diğer tarayıcılarla aynı hizaya getiriyor,,kodları css stil dosyanın başladığı yerden stillerine başlamadan koy, ve sürekli dene, çünkü stil farkınıda eklemen gerekicek , onun için en baştan stillerinin başladığı css 'in en üstüne yerleştir..zaten css reset makalelerindede bunları okursun..inşallah işe yarar, kolay gelsin.
kaynak : www.aydinmahmut.com/cssde-kullanilan-reset-css-nedir/
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 " 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}bu alandan sonra div yazı veya diğer veya stil tanımlamalarına buradan devam ediyorsun,
iyi akş
arka plan fixed durumda değişiklikler yaptım,,css düzenindeki fixed ayarlarına bakarsan anlarsın..birde tarayıcı farkını kapatma amaçlı ,,DOCTYP ekledim..
css dosyası olarak aşağıdaki kodları kullan ( aynı bu halde css dosyana tut kopyala ve yapıştır,, )
<style type="text/css">
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>
<style type="text/css">
.fikstur{
margin: 5px 0px 10px;
text-align: center;
font-size: 35px;
}
.fikstur span{
background-color: #000000;
color: #FFFFFF;
padding-right: 3px;
padding-left: 3px;
}
body{
background: url("http://celebimutfak.com/Bursa-24.jpg");
background-attachment: fixed;
background-position: center top;
background-repeat: repeat;
}
#sayfa{
padding-top: 65px;
width: 980px;
background-color: #FFFFFF;
margin:0 auto 0 auto;
border: 3px solid #C2C2C2;
}
.logo{
width: 980px ;
padding-top: 5px;
margin: 0 auto 0 auto;
overflow: hidden;
float: none;
}
.sol{
overflow:hidden;
float:left;}
.sag{
outline: medium none;
overflow:hidden;
float:right;
right: 5px;
width:300px;
padding-right: 5px;
}
.sag_baslik{
background-color: #2EAACC;
height: 25px;
color: #FFFFFF;
margin-top: 7px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
font-weight: bold;
font-family: "Calibri", sans-serif;
font-weight: bold;
font-size: 16px;
}
.son_haber{
text-indent: 15px;
width: 100%;
list-style: none outside none;
padding-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
.son_haber li{
width: 100%;
border-bottom: 1px dotted #C0C0C0;
overflow: hidden;
height: 23px;
list-style: none outside none;
padding-top: 2px;
}
.son_haber li:hover{
background-color: #DEF2E6;
list-style: none outside none;
}
.form{
border: 1px solid #E5C1CC;
color: #000000;
font-family: "Tahoma", "Geneva", sans-serif;
font-size: 15px;
height: 26px;
padding: 0px 0px 0px 10px;
width: 215px;
}
.sag_ic{
background-color: #FFFFFF;
color: #000000;
border-left: solid 1px #C2C2C2;
border-right: solid 1px #C2C2C2;
border-bottom: solid 1px #C2C2C2;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
font-family:Arial;
}
.alt{
overflow:hidden;
float:none;
width:100%;
height: 100px;
border:solid 1px #C2C2C2;
}
.ust_banner{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 70px;
background-image: url("http://i4.imgiz.com/images/pattern_v5-0001.png");
font-family: arial;
}
#ust_menuu{padding-bottom: 0px; background: url(
);position:relative;display:block;height:37px;font-size:13px;font-weight:bold; border-top: 2px solid #000000; border-bottom: 2px solid #000000;}
#ust_menuu ul{margin:0;padding:0;list-style-type:none;width:auto;}
#ust_menuu ul li{display:block;float:left;margin:0; padding-top: 1px; font-family: arial;}
#ust_menuu ul li a{display:block;float:left;color:#666;text-decoration:none;padding:11px 20px 0 10px;height:23px;}
#ust_menuu ul li a:hover{color: #ffffff;}
.header{
position: relative;
width: 980px;
margin: 0 auto 0 auto;
color: #000000;
}
.fixed_banner{
border-top: medium solid #2EAACC;
width:100%;
background-color: #1C1C1C;
height: 35px;
margin-right: auto;
margin-left: auto;
position: fixed;
left: 0px;
bottom: 0px;
font-family: arial;
}
.logo_alti {
background-color:#FF0000;
height: 200px;
width: 100%;
position: absolute;
left: 0px;
}
.sol{
background-color:#FFFFFF;
}
.ust_sag{
overflow: hidden;
float: right;
color: FFFFFF;}
.ust_menu{
overflow: hidden;
float:none;
margin: 7 auto 0 auto;
color:FFFFFF;
width:980px;
}
.giris_kayit:hover{
font-weight:bold;
font-family: "Calibri", sans-serif;
}
</style>
html ve bady taglarını açmamaışsın ve kapatmamaışsın,,dosyalarına bak 2. hatanda orda ..neyse ben düzelttim,
ve ayreten <!DOCTYPE için ikinci bi fark ekledim. tarayıcı farkının kapatması açısından..css resetlik bi olay yok sitende,,
operada explorerde ve chromda sorun çıkarmadan çalışıyor.. gövde BODY kodların ve içerik aşağıdaki gibi al kopyala ve yapıştır..
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link href="index.css" type="text/css" rel="stylesheet" />
<div class="fixed_banner">
<div class="ust_menu">
FOTOGRAFLAR VIDEOLAR BURSA TURİZM HARİTASI
</div>
<div class="ust_menu_sag"></div>
</div>
<div class="ust_banner">
<div class="header">
<div class="logo"><img src="logo.png"></div><br><br>
</div></div>
<div id="sayfa">
<div id="ust_menuu"><ul class="">
<li><a href="http://css.kobifis.com/menu/detay/2" title="şehirdeki etkinlikler">ETKİNLİKLER</a></li>
<li><a href="http://css.kobifis.com/menu/detay/2" title="şehirde gezmek için ideal mekanlar">GEZİLECEK YERLER</a></li>
<li><a href="http://css.kobifis.com/menu/detay/2" title="bursa'ya gelmenin yolları" >ULAŞIM YOLLARI</a></li>
<li><a href="http://css.kobifis.com/menu/detay/2" title="konaklama mekanları/ oteller, pansiyonlar, kiralık evler">KONAKLAMA MEKANLARI</a></li>
<li><a href="http://css.kobifis.com/menu/detay/2" title="iletişim bilgilerimiz // reklam, görüş ve öneri">İLETİŞİM</a></li>
<li style="padding-top: 5px;"><form><input type="text"onblur="this.value='site içi arama'" value="site içi arama" class="form" name="bulten"><button type="submit" style="color: #FFFFFF; background-color: #000000; height: 26px; border: 1px solid #E5C1CC; font-size: 15px;" value="Üye Ol">ARA</button></form></li>
</ul></div>
<div>
<div class=sol> <form><input name="gir" type="button" value="FaceBOOK ile giriş yap"></form> </div>
<div class=sag>
<div><button class="giris_kayit" style="margin-top: 7px;background-color: #ff0000; color: #FFFFFF; border:1px #C2C2C2; width: 147px; height: 25px; font-size: 14px;">GİRİŞ YAP</button> <button class="giris_kayit" style="width: 147px; height: 25px; background-color: #1600c1; color: #FFFFFF; border:1px #C2C2C2; font-size: 14px;">KAYIT OL</button></div>
<div class="sag_baslik">SON HABERLER</div>
<div class="sag_ic" style="background-color: #f6f6f6; padding-left: 0px; padding-right: 0px; padding-bottom: 0px;"><ul class="son_haber">
<li style="border-top: 1px dotted #D6D6D6;">haber1</li>
<li>haber2</li>
<li>haber3</li>
<li>haber4</li>
<li>haber5</li>
</ul></div><br>
<div class="sag_baslik">SPONSOR REKLAMI</div>
<div class="sag_ic">sponsor reklam</div><br>
<div class="sag_baslik" style="background-color: #008000;">BURSASPOR</div>
<div class="sag_ic" style="background: url(
); height: 200;">
<div class="fikstur"><img class="left" src="http://teksas.org/haber/fikstur/IstanbulBB.gif"/>
<span>0 : 4</span>
<img class="right" src="http://www.teksas.org/haber/fikstur/bursaspor.gif"/></div>
<ul class="bursa_sag"><li>Bursaspor'u Tanıyın</li><li>Bursaspor Taraftarı (Texas)</li><li>Bursaspor Haberleri</li></ul></div><br>
<div class="sag_baslik" >ŞEHİRDEKİ ETKİNLİKLER</div>
<div class="sag_ic">TURİZM HARİTASI__</div><br>
<div class="sag_baslik">ŞEHRİ NE KADAR TANIYORSUN?</div>
<div class="sag_ic">HABERLER__</div><br>
<div class="sag_baslik" style="background-color: #AF3C5F;">BURSA'DAN HABERDAR OL</div>
<div class="sag_ic" style="font-size:12px;"><p>Şehirde olup bitenden haberim olsun diyorsan.</p> <form><input type="text"onblur="this.value='e-posta adresiniz'" value="e-posta adresiniz" class="form" name="bulten"><input type="submit" style="color: #FFFFFF; background-color: #000000; height: 26px; border: 1px solid #E5C1CC; font-size: 15px;" value="Üye Ol"> </form><p></p> </div><br>
</div>
</div>
<div class=alt></div>
<body>
</html>
Bence internet explorer'ı düşünme. Zaten web sitesinden anlayan adam IE kullanmaz. Çünkü çoğu şeyi desteklemiyor. En iyisi Mozilla, Chrome.. Bunlarda iyi çalışıyosa problem yok.
