[cok_yasa_kamil]

merhabalar...
CSS ile hazırlamaya çalıştığım sayfada container içindeki sola dayalı menu div'i container kısa kalınca üzerinden aşıp geçiyor. bunu yapamadım. aradım zoque da bulamadım..
neyi eksik yazdım?

(sayfa sadece Firefox'ta düzgün çıkıyor bu da ayrı bir dert tabii...)

gerekirse kodları gönderirim.

[nothingrows]

merhabalar...
CSS ile hazırlamaya çalıştığım ..
neyi eksik yazdım?

...

gerekirse kodları gönderirim.

Belkide neyi eksik yazdığını öğrenebilmen için tek gereken kodlar olabilir.

[cemshid]

o aşağı taşan menü kısmısını float:left; ile sola aldın ya, içinde bulunduğu o kalın çerçeveli alandan çıktı artık o, o sebeple..
kalın çerçeveli alan, sağda kalan içerik kadar uzarken, soldaki kısım daha uzun olsada, ilgilendirmiyor artık kalın çerçeveli alanı..

diyelim ki, kalın çerçeveli alanın id'si "mahmut"

<div id="mahmut">

 bişiler bişiler bişiler...

</div>

işte tam da mahmut'u kapatmadan evvel şey yazarsan derdine derman olacak

<div id="mahmut">

 bişiler bişiler bişiler...
<div style="clear:both;line-height:1px;">&nbsp;</div>
</div>

[cok_yasa_kamil]

ağzına sağlık cemshid kardeş...

çok güzel oldu... ferah oldu

teşekkür ederim...

[cok_yasa_kamil]

tekrar merhabalar!
yeni bir konu açmadan benzer bir konu olduğu için buradan sormak istedim...

div içerisinde yer alan yazı boyutunca div sorunsuz uzamakta, fakat işin içine imaj girince aynı sonuca ulaşamıyorum.
FF ve IE de durum aynı.
ekte meramımı anlatmaya çalıştım.
1. örnekte imaj boyutu yazı çokluğu ile aynıysa veya küçükse hiç sorun olmuyor,
2. örnekteki gibi imajın boyutu daha büyükse aynen taşıyor.

CSS'de extra bir img tanımlaması yok. yani standart img{} var...

ne yapmam lazım?

[sahip]

CSS Dosyanda Img Ler Için 2 Tanim Ver.
Biri Küçük Olanlar Için Olsun Diğeri Büyük Olanlar Için.

[cok_yasa_kamil]

sahip tarafından gönderilen mesaj:

CSS Dosyanda Img Ler Için 2 Tanim Ver.
Biri Küçük Olanlar Için Olsun Diğeri Büyük Olanlar Için.

farklı ne yazacağım ki?
hangi ifadeleri kullanıp div'i imaj kadar genişleteceğim...

[sahip]

kodları görebilir miyim?

bunu Wordpress de bende de yapıyor.

[Skeleton]

id="yazi" olan div etiketini kapatmadan hemen önce şu kodu ekleyerek elde etmek istediğin görüntüyü yakalayabilirsin:

<div style="clear:both;"></div>

Tabi böyle anlamsız bir div kullanmak istemez isen başka bir çözüm daha var:

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-Mac \*/
* HTML .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-Mac */

Kullanımı için şu adrese gözatabilirsin.

[cok_yasa_kamil]

@skeleton, ana sayfada yazılar aspdeki left(yazi,500) koduyla görüntülendiği için <div /> çözüm olmuyor, o kodun bulunduğu satır 500'den sonraya kalıyor. resim kodundan sonra yazarsak ta hiç olmuyor verdiğin linktekileri incelemeye çalıştım fakat onlar metin bazındaki sorunlar ki, yukarıdaki ilk mesajda bu sorunum vardı sağolsun cemshid yardımcı oldu.
hala Google da aramalarım sürüyor

@sahip, kodları istemiştin. biraz çorba gibi ama neticede amatörüz... idare edin artık

/* CSS Document */



body {

	background-color:white;

	font-family: trebuchet ms, tahoma, , serif;

	font-size:0.94em;

	color:#333333;

	/*line-height:20px;*/

	cursor:default;

	margin:0;
	
	padding:0;

	background-image:  url(imaj/zemin.gif);
	
	
	
	

}


#title{
margin:auto auto -9px auto;
width:700px;
float:top;
}

#container {

	width:700px;

	padding:10px;

	background-color:#FFFFFF;

	margin:0 auto 15px auto;
	
	border:20px solid #99CC33;

	 	clear:both;

}

#header {
	
	
	width:700px;

	background-color:white;

	height:274px;

	color:#FFFFFF;

}


#main_menu {

	width:700px;

	padding-top:5px;

	padding-bottom:2px;

	background-color:#CCCCCC;


	color:#FFFFFF;

	margin-bottom:10px;

	margin-top:10px;
}


.tepe {


	float:left;

}
/*.menu{
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
display:block;
width:134px;
padding:0px 4px 2px 10px;
font-size:1.0em;
font-weight:normal;
background-color:inherit;
color:#286ea0;
border:1px solid #ffffff;
}

.menu:hover{
background-color:#CCFF33;
color:#286ea0;
border:1px solid #FF9900;
}
*/
#sidebar {

	width:150px;

	border:1px dashed #FF9900;

	padding:0px;

	float:left;
 
 	clear:left;

	background-image:  url(imaj/menu_zmn.jpg);

	background-position:bottom right;

	background-repeat:repeat-x;
	
	margin-bottom:10px;

}
/*#sidebar2 {

	width:150px;

	border:1px dashed #FF9900;

	padding:0;

	float:left;
 
 	clear:left;
	
	margin-bottom:10px;
	
	/*text-align:center;
}
#sidebar2 a {
 	 /*display: block;
 	 
 	 text-decoration: none;  
}*/
 #sidebar img {
padding: 4px 4px 4px 4px;
	
border:0 !important;
 
 	 
	 /*display: block;*/
 
}
#sidebar .menu {
  margin: 10px 0 0 0;
}

#sidebar .menu a {
	  font-family:Tahoma, Arial;
		color:#CC0000;
		font-weight:bold;
 	 display: block;
 	 padding: 4px 0 4px 20px;
 	 text-decoration: none;  
}

#sidebar .menu a:hover {
  background: url(imaj/side_menu.jpg) no-repeat center center;
text-decoration: none;
} 
#sidebar h1,h2,h3 {
	font-family:Arial Narrow, Arial, Helvetica, sans-serif;
	letter-spacing:-1px;
	color:#000000;
	border:none;
	background-image:none;
	text-align:left;
	text-indent:5px
}

img{
position:relative;
margin:3px 10px 8px 5px !important;
border:1px solid #cccccc !important;
}

.yazi {
line-height:20px;

	margin-left:170px;

	padding:10px;

	border: 1px solid #cccccc;

	background-image:  url(imaj/yazi_kose1.jpg);

	background-position:top left;

	background-repeat:no-repeat;

	margin-bottom:10px;

}

.yazi:hover {

	background-image:  url(imaj/yazi_alt.jpg);

	background-position:bottom right;

	background-repeat:repeat-x;

	margin-bottom:10px;
	
	border: 1px solid #99CC33;

}

.yazi p {

	margin:10px;
	text-indent:5px;
	text-align:justify;

}

.yazi a{
text-decoration:none;
background-color:inherit;
font-weight:bold;
color:#286ea0;
}

.yazi a:hover{
background-color:inherit;
color:#303030;
border-bottom: 1px dashed;	border-color: red
}

.yazi_bilgi {

	font-family:Verdana, Arial, Helvetica, sans-serif;

	font-size:10px;

	color:#666666;

	letter-spacing:2px;


}

.yazi_bilgi a {

	font-weight:bold;

	text-decoration:none;

	color:#000000;

}

h1,h2,h3 {	

	font-family:Arial Narrow, Arial, Helvetica, sans-serif;

	letter-spacing:-1px;

	color:#000000;

	border-bottom:2px solid #cccccc;

	padding-bottom:5px;

	padding-top:5px;
	
}
h4 {	

	font-family:verdana, Arial Narrow, Arial, Helvetica, sans-serif;

	margin:0;
font-size:3.6em;
letter-spacing:-2px;
text-align:right;
background-color:inherit;
color:#FF6600;

}

.comment {
	margin-left:170px;
	padding:10px;
	border: 1px solid #cccccc;
	background-image: url(imaj/menu_zmn.jpg);
	background-position:bottom right;
	background-repeat:repeat-x;
	margin-bottom:10px;
	font-family: verdana, Arial, Helvetica, sans-serif;
	font-size:0.6em;
	text-align:center;
	color:#999;
	
}
.comment a{
text-decoration:none;
background-color:inherit;
font-weight:bold;
color:#999;
}

.comment a:hover{
background-color:inherit;
color:#000000;
border-bottom: 1px dashed;	border-color: red
}
.sayfalama {
	font-family: verdana, Arial, Helvetica, sans-serif;
	font-size:0.8em;
	font-weight:normal;
	color:#666666;
	margin-left:170px;
	padding:10px;
	border: 1px solid #cccccc;
	background-image: url(imaj/menu_zmn.jpg);
	background-position:bottom right;
	background-repeat:repeat-x;
	margin-bottom:10px;
	text-align:center;
}
.sayfalama a{
text-decoration:none;
background-color:#cccccc;
font-weight:bold;
color:#000000;
}

.sayfalama a:hover{
background-color:inherit;
color:#000000;
border-bottom: 1px dashed;	border-color: red
}