Firefoxa göre css

**kubilayk** · 14.07.2006 23:40

Merhaba,

CSS kodunda bir kaç düzenleme yaptım umarım işini görür. Bu şekilde hem IE'de hem de Firefox'da sorunsuz ve aynı şekilde çalışıyor.

PHP Kodu:


<!-- CSS Kodu-->



#grikutu {

width:auto;

height:100%;

margin:0px;

padding:10px;

border:1px solid #d1d3be;

background-color:#eaebee;

} 



#grikutu1{

display:table;

float:left; 

width:500px; 

height:400px; 

padding:3px;

border:1px solid #d1d3be;

background-color:#ffffff;

} 



#grikutu1_{

display:table-cell;

width:100%; 

height:100%;

padding:10px;

border:1px solid #e6e7da;

background-color:#F4F4ED;

} 



#grikutu2{

display:table;

float: left; 

width:205px; 

height:400px; 

margin-left: 10px; 

padding:3px;

border:1px solid #d1d3be;

background-color:#ffffff;

} 



#grikutu2_{ 

display:table-cell;

width:100%; 

height:100%; 

padding:10px;

border:1px solid #e6e7da;

background-color:#f4f4f6;

}

Çalışmalarında başarılar...

**tesera** · 15.07.2006 00:40

Emeğine sağlık teşekkür ederim.
Hemen deneyeceğim yarın sonucu yazarım.

**tesera** · 15.07.2006 00:49

#grikutu {
width:auto;
height:100%;
margin:0px;
padding:10px;
border:1px solid #d1d3be;
background-color:#eaebee;
}

Burada bir problem var yükseklik boyutu büyümüyor.

**kubilayk** · 15.07.2006 00:51

anlamadım tam olarak nereyi değiştirmek istiyorsun ?

**tesera** · 15.07.2006 09:25

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Sayfanın üstüne bunu ekleyince yazdığınız CSS kodu da bozuk gözüküyor.

**panteray_2005** · 15.07.2006 19:58

Bu konu hakkında bir yazı yazmıştım.Belki işine yarayabilir...

http://panteray.com/blog/index.asp?o...g_detay&id=111

**KaanF** · 29.03.2008 02:10

Witkey, verdiğin kodu kullandım gayet güzel çalışıyor. Teşekkürler.

**Vincent** · 29.03.2008 15:00

Fark aslında şundan kaynaklanıyor: width:100% dedikten sonra yazdığınız margin, padding değerleri dıştaki divler taşmasina yol açıyor IE7 ve Firefox'ta olduğu gibi (hatti altta scrollbar cikiyor bu yuzden). IE6 ise divler taşmasın diye genişletme yapıyor. Bu durumda hem IE7 hem Firefox ( hem opera ) icin farklı kod yazmaktansa sadece IE6 ya yönelik conditinal comment kulanmak mumkün. Ama zaten çok karmaşık bir yapı yok, o yuzden hepsinde çalışacak ortak kod yazmak daha iyi olur:

Kod:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml" XML:lang="en">
<head>
	<title>Untitled Page</title>
	<style type="text/CSS" media="screen">
*{
	margin:0;
	padding:0;
}

.clear{
clear:both;
background-color: #333;
}

#grikutu{
border: #d1d3be 1px solid;
padding: 10px;
background: #eaebee;
}

#grikutu1{
float: left;
border: #d1d3be 1px solid;
width:500px;
background: #ffffff;
margin-right: 10px;
}

#grikutu1_{
padding: 10px;
margin: 3px;
border: #e6e7da 1px solid;
height:372px;
background: #F4F4ED;
}

#grikutu2{
float:left;
border: #d1d3be 1px solid;
width:205px;
background: #ffffff;
}

#grikutu2_{
padding: 10px;
margin: 3px;
border: #e6e7da 1px solid;
height:372px;
background: #f4f4f6
} 
	</style>
</head>
<body>
<div id="grikutu">
	<div id="grikutu1">
		<div id="grikutu1_">
		Veriler..
		</div>
	</div>
	<div id="grikutu2">
		<div id="grikutu2_">
		Veriler..
		</div>
	</div>
	<div class="clear"></div>
</div>
</body>  
</HTML>

#grikutu divinin height:100%ile sayfayi kaplamasi icin:

Kod:

HTML,body {height:100%;}

**Coder32** · 29.03.2008 17:40

Ya arkadaşlar CSS'de tarayıcı sıkıntısını hep yaşıyoruz.

Şöyle internet Explorer ile Firefox'un CSS uyuşmazlıklarının listelendiği bir web adresi yokmudur?

Bilen varmı?

**fatihturan** · 29.03.2008 21:17

Coder32 tarafından gönderilen mesaj:

Ya arkadaşlar CSS'de tarayıcı sıkıntısını hep yaşıyoruz.

Şöyle internet Explorer ile Firefox'un CSS uyuşmazlıklarının listelendiği bir web adresi yokmudur?

Bilen varmı?

Evet burada var.

Konu Başlığı: Firefoxa göre css

Konuyu Paylaş

Seçenekler

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Re: Firefoxa göre css

Bu konu başlığı için etiketler

Mesaj Seçenekleri