تراز قالب با div

آخرین ویرایش: 17-08-2014 ???? 19:53، توسط Daniel

سلام
من یه قالب ساده طراحی کردم و لی تو تراز کردن قسمت main,sidebarبا سایر قسمت ها مشکل داشتم میخواستم ببینم که چه جوری میتونم همه رو با هم تراز کنم؟

<style type="text/css">

	body
	{
		background-color:#999; 
	}
	
	#header
	{
		width:900px;
		height:120px;
		background-color:#900; 
		margin:0 auto;
		 
	}
	
	#navigation
	{ 
		
		width:900px;
		height:150px;
		background-color:#69F;
		margin:0 auto; 
	} 
	
	#maincontent
	{
		width:500px;
		height:250px;
		background-color:#FC0;
		float:left; 
		margin-left:0 auto;
	}
	
	#sidebar
	{
		width:400px;
		height:250px;
		background-color:#FCC; 
		float:left; 
		margin-right:0 auto;
	} 
	
	#footer
	{
		background-color:#FFF;
		width:900px; 
		height:150px;
		margin:0 auto;
	}

	.clear
	{
		clear:both;
	}
	
</style>


</head>

<body>


	<div id="header">header</div>
    <div id="navigation">navigation</div>
    <div id="maincontent">maincontent</div>
   	<div id="sidebar">sidebar</div>
    <div class="clear"></div>
    <div id="footer">footer</div>

برای اینکه این دو تا div رو تراز کنید میتونید یه div مادر برای این دو تا تعریف کنید
البته float بلاک sidebar رو باید right میکردید.

<style type="text/css">

	body
	{
		background-color:#999; 
	}
	
	#header
	{
		width:900px;
		height:120px;
		background-color:#900; 
		margin:0 auto;
		 
	}
	
	#navigation
	{ 
		
		width:900px;
		height:150px;
		background-color:#69F;
		margin:0 auto; 
	} 
	
	div#content {
	margin: 0 auto;
	width: 900px;
	}

	#maincontent
	{
		width:500px;
		height:250px;
		background-color:#FC0;
		float:left; 
	}
	
	#sidebar
	{
		width:400px;
		height:250px;
		background-color:#FCC; 
		float:left; 
	} 
	
	#footer
	{
		background-color:#FFF;
		width:900px; 
		height:150px;
		margin:0 auto;
	}

	.clear
	{
		clear:both;
	}
	
</style>


</head>

<body>

	<div id="header">header</div>
	
    <div id="navigation">navigation</div>
	
    <div id="content">
		<div id="maincontent">maincontent</div>
		<div id="sidebar">sidebar</div>
	</div>
	
    <div class="clear"></div>
    <div id="footer">footer</div>

درود برشما خیلی سپاس گذارم
شرمنده مشکل این کد کجاست که صفت های cssروی دستورات(footer.copyright)htmlاجرا نمیشه؟

	<div id="header">header</div> 
    <div id="navigation">navigation</div> 
    <div id="maincontent">
    
    		
            	<div id="sidebarleft">sidebarleft</div>
               			 <div id="maincontent1">maincontent</div>
                
                	<div id="sidebarright">sidebarright</div>
    
    </div> 
    
    
    	<div id="footer">footer</div> 
       
        <div id="copyright">copy</div>

اگر دوباره کد ها رو به این صورت قرار بدید اخطار دریافت میکنید
کافیه نوع کد رو از ویرایشگر انتخاب کنید:

[align=center]

[/align]

clear: both;

رو به استایل فوتر اضافه کنید

بی نهایت سپاس گذارم کمک خیلی بزرگی بهم کردین:khodeshe:

چطور میتونم برای <body> گردینت بذارم(مشکل کار من اینجاست که گردینت من بصورت تک رنگ به زمینم اعمال میشه)؟

سلام
قوانین رو مطالعه کنید
برای این سوال باید تاپیک جداگانه ایجاد کنید.

تراز قالب با div

سوال برنامه نویسی دارید؟

خوش آمدید