[Çözüldü]Bozulan div sytle.

[ecarpar]

Kullanıcı yorumu sayfası hazırlıyorum. index.php diğer sayfaları jquer yardımı ile bir div in içine çağırıyor, yorum sayfası kendi başına normal olarak çalışıyor; fakat index çağırdığında doğru şekilde çalışmıyor, şöyle ki hepsi bir div in içinde konumlandırılıyor. Fakat bu div index ten çağrıldığında tek satır oluyor ve yazılar dışarıya taşıyor, ama sayfa tek başına çalıştırıldığında böyle bir sorun olmuyor.

İlkin bir div oluşturuyorum bu div şeffaf ve bütün diğer yazılar vs bunun üzerinde konumlandırılıyor bu hepsinin içinde bulunduğu div height değerini alamıyor div'in height değerini otomatik alması için ne yapmam gerekir?
height:100%; yapınca sayfanın tümünü kaplıyor.

idv şeklini alıyor sayfanın kendi başına çalışan hali.



index.php load işlemini yaptıktan sonraki hali.

[alquirel]

Biraz kaynak kod görmeden bir şey demek zor

Aklıma gelen ilk şey, ikinci resimdeki 'div' elemanlarının 'yazar' kısmını aldıktan sonra sonlanması veya 'yazar' kısmından sonraki elemanların stillerindeki bir sıkıntı. (float gibi bir şey kullanılmışsa eğer bu olabilir)

[ecarpar]

Saklanacak bir şey yok hepsi div bunların, jqery ile hide yapıyorum sil denildiğinde mecbur bu yöntemi kullandım.

Kod Seç Genişlet


$sorgu = "SELECT * FROM $DB_Tablo ORDER BY YaziId ASC LIMIT $baslangic,$limit";
$yazdir_sorgu = mysql_query( $sorgu, $Connected) or die(mysql_error() );
while ($row = mysql_fetch_array($yazdir_sorgu)){

echo "<div id=\"Yorum$row[YaziId]\" style=\"width:850px; height:120px;background-color:#666666 ; filter:alpha(opacity=70);        -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7;\"> ";
echo "<div id=\"ust\" style=\"overflow:hidden;\">";
echo "<div style=\"color:#F3F3F3; float:left;\">";
echo "<h2 style=\"position: relative; width:100%;font-family:trebuchet MS;font-size:14px; margin:5px 10px;\">";
echo "Yazar : ";
echo "</h2>";
echo "</div>";
echo "<div style=\"color:#D2D2D2; float:left; margin: 0px -15px;\">";
echo "<h2 style=\"position: relative; width:100%; font-family:trebuchet MS;font-size:14px; margin:5px 10px;\">";
echo ucwords($row['YazanAdi']);
echo "</h2>";
echo "</div>";
echo "<div style=\"color:#F3F3F3; float:left; margin: 0px 15px;\">";
echo "<h2 style=\"position: relative; width:100%;font-family:trebuchet MS;font-size:14px; margin:5px 10px;\">Tarih : </h2>
</div>";
echo "<div style=\"color:#D2D2D2; float:left;margin: 0px -30px; \">";
echo "<h2 style=\"position: relative; width:100%;font-family:trebuchet MS;font-size:14px; margin:5px 10px;\">";
echo $row['tarih'];
echo "</h2>";
echo "</div>";
if ($login){
if ($row['YayinDurumu'] == "0"){

echo "<div id=\"yayinda$row[YaziId]\" vf=\"kaldir$row[YaziId]\" val=\"yayinda$row[YaziId]\" style=\" CURSOR: pointer; float:left; margin:2px 50px; width:79px; height:20px;\" value=\"$row[YaziId]\" onclick= \"javascript: YorumYayinla(this.value),buton_goster_gizle(this.vf,this.val); \">
<img src=\"images/yayinla.jpg\" /> </div>";

echo "<div id=\"kaldir$row[YaziId]\" vf=\"yayinda$row[YaziId]\" val=\"kaldir$row[YaziId]\"style=\" display:none; CURSOR: pointer; float:left; margin:2px 50px; width:79px; height:20px;\" value=\"$row[YaziId]\" onclick= \"javascript: YorumKaldir(this.value),buton_goster_gizle(this.vf,this.val); \">
<img src=\"images/yayindanKaldir.jpg\" />
</div>";

echo "<div style=\" CURSOR: pointer; float:left; margin:5px 10px; width:50px; height:20px; margin:2px \" value=\"$row[YaziId]\" onclick= \"javascript: YorumSil(this.value),gostergizle('Yorum',this.value); \">
<img src=\"images/sil.jpg\" /></div>";
}
else {

echo "<div id=\"yayinda$row[YaziId]\" vf=\"kaldir$row[YaziId]\" val=\"yayinda$row[YaziId]\" style=\" display:none; CURSOR: pointer; float:left; margin:2px 50px; width:79px; height:20px;\" value=\"$row[YaziId]\" onclick= \"javascript: YorumYayinla(this.value),buton_goster_gizle(this.vf,this.val); \">
<img src=\"images/yayinla.jpg\" /> </div>";

echo "<div id=\"kaldir$row[YaziId]\" vf=\"yayinda$row[YaziId]\" val=\"kaldir$row[YaziId]\"style=\"CURSOR: pointer; float:left; margin:2px 50px; width:79px; height:20px;\" value=\"$row[YaziId]\" onclick= \"javascript: YorumKaldir(this.value),buton_goster_gizle(this.vf,this.val); \">
<img src=\"images/yayindanKaldir.jpg\" />
</div>";

echo "<div style=\" CURSOR: pointer; float:left; margin:5px 10px; width:50px; height:20px; margin:2px \" value=\"$row[YaziId]\" onclick= \"javascript: YorumSil(this.value),gostergizle('Yorum',this.value); \">
<img src=\"images/sil.jpg\" /></div>";
}
}//login if

echo "</div>";
echo"<div id = \"cizgi\" style=\"height:25px; width:860px; margin: 0px -200px; border-bottom: dashed #CCCCCC 1px; \"> </div>";
//başlık burada
echo "<div style=\"color:#F3F3F3; margin: -5px 10px ;\">";
echo "<h2 style=\"position: relative; font-family:trebuchet MS; font-size:14px;\">";
echo "<u>". ucwords($row['baslik'])."&nbsp;</u>";
echo "</h2>";
echo "</div>";
//içerik burada
echo "<div id=\"icerik\" style=\"color:#F3F3F3; margin: 7px 10px ;\">";
echo "<h2 style=\" position: relative; font-family:trebuchet MS; font-size:14px;\">";
echo ucfirst($row['yorum'])."<p>";
echo "</h2>";
echo "</div>";
echo "</div>";
echo "<br>";

}//while
}// girişin kisi...
echo "</div>";[code]



[alquirel]

Çok fazla ve gereksiz 'div' etiketi kullanmışsın. Hele ki 'h2' etiketleri tamamen gereksiz olmuş bence, çünkü hepsinde 'font-size' ve 'font-family' özelliklerini tekrardan tanımlamışsın. Bu durumda 'h2' olmasına gerek kalmıyor. Her 'h2'yi bir 'div' ile sarmana da hiç gerek yok.

Sorun da burada çıkıyor zaten, birden fazla 'div'i bir satırda kullanabilmek için 'float'lara başvurmuşsun, bu da tasarımda bozukluğa yer açıyor haliyle.

Ben senin yerinde olsam şöyle yaparım.

Her bir yorum için sadece bir adet 'div' oluştururum.
O 'div'in içine de yazıları 'span' etiketiyle yerleştiririm.

Yani, 'div' kullandığında onu kendi haline bırakırsan bir satırı tamamen doldurur. Bir satırda birden fazla 'div' kullanmak istersen ayrıca uğraşman gerekir.
'span' ise zaten satıriçi bir elemandır, yani birden fazla 'span'ı bir satırda kullanabilirsin ek bir işlem yapmadan.
'div' içine ayrıca bir 'h2' tarzı etiket koymak da gereksiz, aynı biçimlemeleri aynı stilleri 'div' için de yaptığında aynı sonucu elde edersin.

Burada seni asıl yakan 'float' kullanıyor olman, ondan kurtarıcı hamleler yapman lazım.

[ecarpar]

Şimdi şöyle öhüm öhüm nası anlatıcam (kıvırıcam  ) bilmiyorum..

<div id="Yorum46" style="width:850px; height:120px;background-color:#666666 ; filter:alpha(opacity=70);        -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7;"> <div id="ust" style="overflow:hidden;">

kısmı var ya işte burası beni uğraştırıyor, burada opacity düşürdüm, div'in opacity si düştüğü içinde mecburen  o h2 leri kullandım. Kullanmasaydım yazıların da opacity si düşüyor çünkü .. oradaki position: relative; opacity den etkilenmesini engelliyor.

Yorum div i ni aynı zamanda admin giriş yaptığında yeni yorumları görüp onayladıkları yayınlanması içinde hazırladım beğenmediklerini silebiliyor da aynı zamanda. Bunun için jquery hide kullandım.

Burada bu div'i yaparkenki amacım, div'in opacity si düşük olacaktı ve aynı zamanda silindiğinde ekrandan kaybolacaktı, bu opacity düşürmenin fakat div'in içindeki yazıların opacity sini düşürmemenin daha kolay bir yolu varsa onu da kulanabilirim.

[alquirel]

CSS içerisinde background-color özelliğinde alpha kullanılabiliyor olması lazım.
Ama daha kolay bir yol, 0.7 oranında şeffaf olan bir arka plan resmi oluştur istediğin renkte, 'div'in arkaplanına bu resmi iliştir.

Background-color ile ilgili biraz arama yaparak alpha'nın kullanılabilir olup olmadığına bakmak lazım, kullandığımı hatırlar gibiyim, ama şu an acelem olduğundan ben bakamıyorum, size kaldı artık o

[ecarpar]

alquirel
Teşekkür ederim.

[alquirel]

alquirel
Teşekkür ederim.

Rica ederim, görünüm bozukluğu sorununu hallettin mi?

[ecarpar]

alquirel
Teşekkür ederim.

Rica ederim, görünüm bozukluğu sorununu hallettin mi?

O sayfa için gerekli px boyutlarını style lar yardımı ile elle vererek hallettim.. Div leri dışarıdan gelen yazının uzunluğuna göre ayarlayabilsem süper olacaktı ya neyse, kullanıcının belli bir harf sayısı olsun dedim