PHP Ionic Angularjs Phonegap AJAX Javascript CSS MySQL jQuery Forum

พี่ๆครับช่วยดู css ผมหน่อยครับ

พี่ๆครับช่วยดู css ผมหน่อยครับ

จากรูปเลยครับผมอยากให้ กล่องข้อความขึ้นไปอยู่เสมอกันกับกล้องทางด้านซ้ายมื่ออ่ะครับ css ที่ใช้

นี้คือกลอ่งด้านซ้ายน่ะครับ css
<div id="lttl34sp"> 
											  <div id="lttl34"></div>
										</div>
											<div id="lbd33">
												<div class="lb">
													<div class="lr">
													  <div class="ll">
													    <div class="bod">
														
															<div class="floatLeft">
														  		<div style="margin:5px">
														  			<img src="images/oon-images/icon6.jpg" width="64" height="64" class="imgstyle" />
														  			<a href="Mother-Day53.php" target="_blank"><h6>บรรยากาศกิจกรรมวันแม่</h6>
														  			</a> ภาพบรรยากาศกิจกรรมวันแม่่ แม่ ลูก ร่วมทำบุญตักบาตรวันที่ 11 กรกฎาคม 2553	เวลา 09.30											 																	</BR>
																    <div align="right">11-08-2553</div>  
																												   															
													  		  </div>
															
															<div style="clear:both;"></div>
														  
														  	<div style="margin:5px">
														  	  <img src="images/oon-images/icon7.JPG" width="64" height="64" class="imgstyle" />
														  	  <a href="swimming53.php" target="_blank">
														  	  <h6>ขอแสดงความยินดี</h6></a> 
															  	ทับนักกีฬาว่ายน้ำของโรงเรียน เข้าร่วมการแข่งขันว่ายน้ำ ม.วลัยลักษณ์ สปริ้นครั้งที่1 ที่จังหวัดนครศรีธรรมราช คว้า 3 เหรียญ  																ทองแดง จากการแ่ข่งขันประเภท ฟรีสไตล์/แตะขาฟรี/กรรเชียง 
																 </BR>
															<div align="right">21-07-2553</div>																													 															</div>
															<div style="clear:both;"></div>
															
														  <div style="clear:both;"></div>
														  <div style="margin:5px">
														  <img src="images/oon-images/icon8.JPG" width="64" height="64" class="imgstyle" />
														  <a href="gallery.php" target="_blank">
														  <h6>แข่งขันกีฬาอำเภอ ประจำปี2553</h6> </a>
														  	ขอแสดงความยินดี กับทับนักกรีฑาของโรงเรียนที่คว้าเหรียญรางวัล 1 เหรียญทอง 1 เหรียญเงิน 5 เหรียญทองแดง	
														  </BR>
																	<div align="right"> 13-07-2553</div>
														  </div>													
														 
														  	<div style="clear:both;"></div>
														  <div style="margin:5px">
														  <img src="images/oon-images/icon.JPG" width="64" height="64" class="imgstyle" />
														  <a href="stopoil.php" target="_blank">
														  <h6>Stop Oil Drilling</h6> </a>
														  	อุ่นรักร่วมจับมือรอบเกาะสมุย เพื่อแสดงพลังปฏิเสธอุตสาหกรรมปิโตรเคมีที่กำลังรุกคืบเข้าสู่เกาะสมุย เกาะพะงัน เกาะเต่า  	
															ประกาศมาตรการต่อไปเตรียมร้องศาลปกครองเหมือนกรณีมาบตาพุด  พร้อมสร้างแนวร่วมกับองค์กรต่างๆทั่วประเทศ 
															และศึกษาข้อมูลเพิ่มเติมเพื่อสร้างความเข้าใจกับประชาชน	
														  </BR>
																	<div align="right">31-07-2553</div>
														  </div>	
														  		
															</div><!--floatLeft -->
													      
													    </div>
													  </div>
													</div>
												</div> 
											</div> 

ส่วนกล่องข้อความด้านขวา css
<div id="lttl36sp">
										  <div id="lttl36"></div>
										</div>
												<div id="lbd352">
													<div class="lb">
														<div class="lr">
															<div class="ll">
															  <div class="bod">
															  <p><a href="#">กำหนดวันสอบกลางภาคระดับประถม 23-24 กันยายน 2553<h>|| 2-09-2010</h></a></p>													   <p><a href="#">กำหนดวันประกาศผลสอบระดับประถม  วันที่ 1 ตุลาคม 2553 <h>|| 21-09-2010</h></a></p>														<p><a href="#">กำหนดวันประกาศผลสอบระดับอนุบาล วันที่ 30 กันยายน 2553 <h>|| 21-09-2010</h></a></p>
															  <p><a href="#">กำหนดวันปิดภาคเรียน วันที่ 1 ตุลาคม 2553 ถึง วันที่่ 26 ตุลาคม 2553<h>|| 2-09-2010</h></a></p>
															  <p><a href="javascript:;" class="style4" onClick="MM_openBrWindow('newparent.php','view','status=yes,scrollbars=yes,width=750,height=550')">
															  โรงเรียนอุ่นรักเกาะสมุย เปิดคอร์สสอนว่ายน้ำSwimming Course รายละเอียดดังนี้
															    <h>|| 2-09-2010</h>
															  </a></p>														 	


															 	
															   
															</div>
															</div>
														</div>
													</div>
												</div>
												
						

ไม่ทราบต้องปรับเปลี่ยน โค๊ด css ยังไงครับให้กล่องข้อความอยู่ระดับเดียวกันทั้งสองอ่ะครับ

 



โดย:  Boy415 IP: 223.207.30.xxx วันที่: 09-10-2010 เวลา: 00:09:48

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ


  • ( หรือ สามารถทำการ สมัครสมาชิก และล็อกอิน ด้วย ปุ่ม Log in with Facebook ด้านล่าง )
 ความคิดเห็นที่ 3

พี่ครับตอนนี้ผมแก้ บรรทัด clear:both; จะได้ดังรูป

ขนาดความสุงนิดหนอ่ย ผมเคลียร์บรรทัดของ clear:both;  ของโค๊ด css ด้านล่าง อ่ะครับ จะได้ดังรูปแต่จะเพี้ยนขนาดของสวนสูงนิดนหน่อย



โดย:  Boy415 IP: 223.207.30.xxx วันที่: 09-10-2010 เวลา: 01:12:52
 ความคิดเห็นที่ 2

คลิกขวาวิวซอร์ส จากตัวอย่าง http://www.ninenik.com/demo/css_layout_set.php



โดย:  Ninenik IP: 124.121.247.xxx วันที่: 09-10-2010
 ความคิดเห็นที่ 1

โทษครับ ส่วนนี้เป็นโค๊ด css ที่ใช้กับกล่องข้อความด้านซ้าย

#lttl34sp {
	position:relative; 
	float:left; 
	clear:both;
	width:555px;
	height:40px; 
	background:transparent; 
	font-size:1px;
} 
#lttl34 {
	position:relative; 
	float:left; 
	clear:both; 
	top:5px; 
	width:555px; 
	height:30px;
	background:url("images/Whats-New.gif") no-repeat;
	font-family:arial,helvetica,sans-serif; 
	font-weight:bold; 
	font-size:14px; color:#FFFFFF;
	
}
#lttl34 .comment {
	position:relative;
	/*position:absolute;*/
	text-align:left;
	left:20px;
	width: 510px;
	top:5px;
	
}
#lttl34 .comment img1 {
	float:right;
	border:solid 1px #999966;
	padding:5px;
	margin-right:10px;
}
#lbd33 {
	position:relative; 
	float:left; 
	clear:both; 
	width:555px; 
	height:385px; 
	background:#FFFFFF url("images/udp4.gif") repeat-x; 
	font-size:10px;
}
#lbd33 .lb {
	position:relative; 
	float:left; 
	background: url("images/dot5.gif") 0 100% repeat-x; 
	width:100%;
	height:385px;
}
#lbd33 .lr {
	position:relative; 
	float:left; 
	background: url("images/dot5.gif") 100% 0 repeat-y; 
	width:100%;
	height:385px;
}
#lbd33 .ll {
	position:relative; 
	float:left; 
	background: url("images/dot5.gif") 0 0 repeat-y; 
	width:100%;
	height:385px;
}
#lbd33 .bod {
	position:relative; 
	color:#000000; 
	background:transparent; 
	height:285px; 
	font-family:arial; 
	font-size:11px; 
	margin:0; 
	padding:0px 0px 0px 0px;

}
#lbd33 .bod a {
	text-decoration:none;
	color:#0099FF;
}

และส่วนของกล่องข้อความด้านขวาหรือ รูปกล่องด้านล่าง css

#lttl36sp {
	position:relative; 
	float:right;
	clear:both; 
	width:435px; 
	height:35px; 
	background:transparent; 
	font-size:1px; 
	top:2px;
} 
#lttl36 {
	position:relative; 
	float:right;
	width:435px; 
	height:35px; 
	/*background: url("images/Newparents.gif") no-repeat;*/
	background:url(images/NewParents.gif) no-repeat;
	font-family:arial,helvetica,sans-serif; 
	font-weight:bold; font-size:14px; 
	color:#FFFFFF;
}
#lttl36 .comment {
	/*position:relative; */
	position:absolute;
	text-align:right;
	left:32px;
	top:1px;
	width:430px;
	height:35px;
}
#lbd352 {
	position:relative; 
	float:right;
	clear:both; 
	width:435px; 
	height:250px; 
	background:#FFFFFF url("images/udp6.gif") repeat-x; 
	font-size:10px;
}
#lbd352 .lb {
	position:relative; 
	float:right;
	background: url("images/dot5.gif") 0 100% repeat-x; 
	width:100%;
	height:230px;
	
}
#lbd352 .lr {
	position:relative; 
	float:right;
	background: url("images/dot5.gif") 100% 0 repeat-y; 
	width:100%;
	height:230px;
	
}
#lbd352 .ll {
	position:relative; 
	float:left; 
	background: url("images/dot5.gif") 0 0 repeat-y; 
	width:100%;
	height:230px;

}
#lbd352 .bod {
	position:relative; 
	color:#000000; 
	background:transparent; 
	height:230px; 
	font-family:arial; 
	font-size:10px; 
	margin:10px; 
	padding:2px 2px 2px 2px;
	
}
#lbd352 p{
border-bottom:solid 1px #ccc;
/*border-bottom:dashed 1px #ccc;*/
font-size:12px !important;
padding-left:15px;
background:url(images/li81.gif) no-repeat;
background-position:center left;
background-repeat:no-repeat;
color:#666666;

}

#lbd352.p h{
float:right;
font-size:10px;
color:#000000;
}/* HOT CRIPT*/

 

 



โดย:  Boy415 IP: 223.207.30.xxx วันที่: 09-10-2010 เวลา: 00:15:42