พิมพ์หน้านี้ - ปัญหา CSS...วางดิสเพลย์สินค้า จัดให้หน่อยคับ..(◡‿◡✿)

(http://img251.imageshack.us/img251/2664/readmore.jpg)

หวัดดีครับ คือ
ต้องการจัดเรียง เเบบ สองคอลัมม์ มี
รูปภาพ + ข้อความ + readmore
ตามตัวอย่างอ่าคับ ต้องการใช้ลิส li
(ลองทําดูเเล้ว ฝีมือยังไม่ถึงอ่าคับ)

วอนผู้รู้ จัด CSS ให้หน่อยคับผม

โค็ดหน้า

<div class="listproduct">
   <ul>
   <li><h3>product name</h3>
   <img src="product.jpg" /> <p>รายละเอียดสินค้า ผลิตภัฒฑ์ คีย์ข้อมูลทั้งหมดอย่างสังเขปบรรจุไว้ทีนี้ </p><span class="readmore"><a href="#"><img src="icon.jpg"/></a></span>
   </li>

   <li><h3>product name</h3>
   <img src="product.jpg" /> <p>รายละเอียดสินค้า ผลิตภัฒฑ์ คีย์ข้อมูลทั้งหมดอย่างสังเขปบรรจุไว้ทีนี้ </p><span class="readmore"><a href="#"><img src="icon.jpg"/></a></span>
   </li>

   <li><h3>product name</h3>
   <img src="product.jpg" /> <p>รายละเอียดสินค้า ผลิตภัฒฑ์ คีย์ข้อมูลทั้งหมดอย่างสังเขปบรรจุไว้ทีนี้ </p><span class="readmore"><a href="#"><img src="icon.jpg"/></a></span>
   </li>

   <li><h3>product name</h3>
   <img src="product.jpg" /> <p>รายละเอียดสินค้า ผลิตภัฒฑ์ คีย์ข้อมูลทั้งหมดอย่างสังเขปบรรจุไว้ทีนี้ </p><span class="readmore"><a href="#"><img src="icon.jpg"/></a></span>
   </li>

   </ul>

   </div>

อ้างจาก: kitazawa1st ที่ 16 ธันวาคม 2010, 17:57:59

โค๊ด:

<style type="text/css">
<!--
div.listproduct {
	width:560px;
}

div.listproduct li {
	width:260px;
	float:left;
}
-->
</style>

ที่เหลือก็จัดเอานะครับ

:wanwan017: :wanwan017:

ขอบคุณมากครัาบบ
ยังบวกไม่ได้ฝากไว้ก่อน
อิอิ

..

ThaiSEOBoard.com

พัฒนาเว็บไซต์ => Programming => ข้อความที่เริ่มโดย: นิติพงษ์ ที่ 15 ธันวาคม 2010, 19:32:44