tarayıcı farkı

arkadaşlar chrom' da bu şekilde gözüküyorken http://g1206.hizliresim.com/y/s/8mqvc.png

mozilla opra ve explorer de ise bu şekilde gözüküyor http://g1206.hizliresim.com/y/s/8mqx1.png
yani yukardaki şirket logosunu alan ortabannerdiv adını verdiğim div mozilla opra ve explorer aşağıya kayıyor.bu sorunu nasıl düzeltebilirim..

css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<head>

<style type="text/css">

#yavarlakkenardiv {
width: 1100px;
background-color: #333;
border-radius: 25px;
box-shadow: 10px 10px 5px #888888;
color: #FFF;
border: solid 1px;
border-top-color: #F0F;
border-right-color: #F00;
border-bottom-color: #309;
border-left-color: #0F9;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
padding: 5px;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
clip: rect(0px,0px,0px,0px);
}

#soldiv {
height: 860px;
width: 200px;
background-color: #03F;
1px solid #000;
border-radius: 20px;
position: fixed;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
margin-top: -1px;
}

#sagdiv {
height: 860px;
width: 200px;
background-color: #03F;
1px solid #000;
border-radius: 20px;
position: fixed;
margin-top: -1px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 890px;
}

#footerdivtaban {
height: 100px;
width: 650px;
background-color: #FF3;
bottom: 97px;
border: 1px solid #000;
border-radius: 20px;
overflow: hidden;
color: #000;
position: fixed;
padding-bottom: 0px;
top: 800px;
}

#ortabannerdiv {
height: 100px;
border: 1px solid #000;
border-radius: 20px;
margin-left: auto;
width: 650px;
margin-right: auto;
position: fixed;
margin-bottom: 0px;
margin-top: -26px;
background-image: url(yavuzlpg.com3/resimler/yavuzticaretlogo648x98.png);
}

#icerikdiv {
background-color: #F00;
width: 650px;
margin-top: 5px;
margin-right: auto;
margin-bottom: 33px;
margin-left: auto;
1px solid #000;
border-radius: 20px;
position: relative;
top: 100px;
}
body {
background-image: url();
background-color: #999;
}
</style>
</head>
<body>
<div id="yavarlakkenardiv">
<center>ana orta div siyah durum ok </center>
<div id="soldiv"> sol div fixed durum oky</div>
<div id="sagdiv"> fixed durum okkkkkkkkkkk</div>
<div id="icerikdiv"><center>içerik div bağımsız autos </center>
<div id="ortabannerdiv"><center><p><h2> </h2></p></center></div>
<p>durum ok </p>

<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>

<p> </p>
<p> </p>
<p> </p>
<p> </p>

<div id="footerdivtaban"><center><p><h2>sabitle sarı</h2></p></center></div>
</div>
</div>
<div style="clear:both;"></div>

</body>
</html>

Doğru Cevap

11 yıl önce yazılmış

deja_wu

24 cevap - 5 soru
css reset kullanarak bu sorunu düzelte bileceğini düşünüyorum.
- sami-
  BU SİTEDEKİ KODLAR İŞE YARIYOR ABİ,,
  http://www.aydinmahmut.com/cssde-kullanilan-reset-css-nedir/
  
  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: &#39;&#39;;
  content: none;
  }
  table {
  border-collapse: collapse;
  border-spacing: 0;
  }
  
  11 yıl önce yazılmış 11 yıl önce güncellenmiş
- deja_wu
  css reset bu zaten :)
  
  11 yıl önce yazılmış
- sami-
  tamam saol
  
  11 yıl önce yazılmış

Cevaplar

Hiç cevap bulunamadı.

sami-

tarayıcı farkı

Doğru Cevap

Cevaplar