|
2006-06-12, 23:49
|
||||
|
||||
css absolute positioning
CSS'de absolute positioning ile sayfayi bolgelere ayiriyorum. Sag sol ve alt olmak uzere. Sol menu ve statik icerik. Sag ise dinamik yerlesiyor, yani her sayfa icin farkli uzunluk olabilir. Dolayisiyla sag taraf bir sayfada cok uzarsa, alt tarafin alanina mudahale etmeye basliyabilir, bunu ayarlamanin bir yolu yok mu, sanirim sag uzadikca altta asagi uzamaya devam etmez, absolute position olduguna gore, yani denemedik ama mantiken oyle. Bu durumda ne kullanilabilir?
__________________
peace love union respect 
|
|
2006-06-13, 02:23
|
||||
|
||||
|
Birincisi sağ tarafa belirli bir yükseklik verip overflow:scroll; dersen bu yüksekliği geçerse kaydırma çubuğu çıkar.Veya sadece statik olan sağ tarafı absolute yaparsın, bu durumda sağ kısım uzadıkça altta ona bağlı olarak kayar.
veya daha kolayı float kullanabilirsin, örnek vermek gerekirse: Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<style type="text/css">
body{
margin:0;
padding:0;
}
#sol{
width:200px;
background-color:#f00;
display:block;
float:left;
}
#sag{
float:left;
width:600px;
background-color:#0f0;
display:block;
}
#alt{
clear:both;
background-color:#00f;
display:block;
}
</style>
</head>
<body>
<div id="sol">sol</div>
<div id="sag">
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
Sağ Sağ Sağ Sağ Sağ Sağ Sağ Sağ <br />
</div>
<div id="alt">Alt</div>
</body>
</html>
|
|
2006-06-13, 10:15
|
||||
|
||||
|
Mesela bu ornekte alt icin pozisyon vermedin sayfanin herhangi bir yerine <p class="alt"> diye girdigimde nereye koyacak? Olay clear:both da mi?
__________________
peace love union respect
|
|
2006-06-13, 17:28
|
||||
|
||||
|
Alıntı:
Normalde div elemanı herhangi bir genişlik versen de yan yana durmaz, yani ikinci div birincinin altına yerleşir. Ancak float kullandığın zaman verdiğin değere göre sola veya sağa yan yana yaslanır. Ayrıca burada <p class="alt"> yazarsan hiç bir şey olmaz çünkü alt diye bir class yok. Biz id olarak tanımladık. Yani senin yapacağın <div id="alt"> <p>yazı yazı yazı</p> </div> gibi kullanacaksın.Tabii istersen id olarak değil class olarak da tanımlarsın, ben sadece mantığını anlaman için örnek olsun diye yapmıştım.
|
|
2006-07-04, 01:41
|
|||
|
|||
|
Kod:
<!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=iso-8859-9">
<title>Untitled Document</title>
<style type="text/css">
<!--
#ust {
background-color: #003366;
margin: auto;
height: 90px;
width: 760px;
display:block;
}
#orta {
background-color: #99CC00;
margin: auto;
width: 760px;
display:block;
}
#alt {
background-color: #990000;
margin: auto;
height: 25px;
width: 760px;
display:block;
}
#orta #sol {
background-color: #0099FF;
float: left;
width: 600px;
display:block;
}
#orta #sag {
background-color: #FF0099;
float: right;
width: 155px;
display:block;
}
-->
</style>
</head>
<body>
<div id="ust">
UST UST UST UST
</div>
<div id="orta">
<div id="sol">
SOL SOL SOL SOL
</div>
<div id="sag">
SAG SAG SAG SAG
</div>
</div>
<div id="alt">
ALT ALT ALT ALT
</div>
</body>
</html>
__________________
........................
|
 |
| Seçenekler | |
| Stil | |
|
|
Benzer Konular
|
||||
| Konu | Konuyu Başlatan | Forum | Cevaplar | Son Mesaj |
| Absolute Agency Ödemiyor | worshiphim | Internetten Para | 13 | 2005-06-18 08:42 |
Normal
