ในส่วนของ footer นั้นจะแบ่งได้เป็น 4 ส่วนใหญ่ๆด้วยกันดังนี้

1. #footer ส่วนนี้จะเก็บรายละเอียด และข้อความทั้งหมดเอาไว้

2. #footer p ส่วนนี้จะเก็บข้อความ "Free Template Powered By Hellomyweb.com"

3. #footer ul , #footer li ส่วนนี้จะเก็บลิงค์ไปยังหน้าหลักของเว็บไซต์เอาไว้

ในส่วนของ #footer, #footer p นั้นจะไม่กล่าวรายละเอียดแล้ว เพราะจะซ้ำกันกับหัวข้อที่ผ่านมา จะพูดถึงแต่ในหัวข้อของ #footer ul , #footer li เท่านั้นเพราะมีเรื่องใหม่ที่ยังไม่เคยกล่าวถึงเลย

---

กำหนดรายละเอียดในส่วน footer li

#footer ul , #footer li กำหนดรายละเอียดส่วนลิงค์ไปหน้าหลัก

จะเห็นได้ว่าลิงค์ของเรานั้นขึ้นมาอยู่ในบรรทัดเดียวกันทั้งๆที่อยู่ใน li tag น่าจะเรียงกันในแนวตั้งมากว่า ที่เป็นแบบนี้ก็เพราะว่าเราได้ใช้คำสั่ง flot:left ในส่วนของ #footer li ดังรูปด้านล่างนั่นเอง

---

เท่านี้เราก็สามารถทำเว็บไซต์ด้วย CSS layout ได้แล้ว

คลิกที่นี่เพื่อดูตัวอย่างเว็บเพจที่เสร็จแล้ว

คลิกที่นี่เพื่อดาว์นโหลดตัวอย่างเว็บเพจที่เสร็จแล้ว