บรรทัดเดียวและคอลัมน์ด้านล่างคือเครื่องหมายคำพูด:
เนื้อความ { ระยะขอบ: 0px; ช่องว่างภายใน: 0px;
#content { margin-left:auto; margin-right:auto; width: 400px; width: 370px; }

ต่อไปนี้เป็นส่วนของเครื่องหมายคำพูด:
เนื้อความ { ระยะขอบ: 0px; การขยายข้อความ: 0px;
#content-top { ขอบซ้าย:อัตโนมัติ; ความกว้าง: 400px;
#content-end {margin-left:auto; margin-right:auto; width: 400px; width: 370px;}

ต่อไปนี้เป็นส่วนของเครื่องหมายคำพูด:
เนื้อความ { ระยะขอบ: 0px; ช่องว่างภายใน: 0px;
#content-top { ขอบซ้าย:อัตโนมัติ; ความกว้าง: 400px

; ; }
#content-end { margin-left:auto; margin-right:auto; width: 400px; width: 370px; }

แถวเดียวและสองคอลัมน์ ต่อไปนี้เป็นส่วนของเครื่องหมายคำพูด:
#bodycenter { ความกว้าง: 700px; ขอบขวา: อัตโนมัติ; ขอบซ้าย: อัตโนมัติ; ล้น: อัตโนมัติ;
#bodycenter #dv1 {ลอย: ซ้าย; ความกว้าง: 280px;}
#bodycenter #dv2 {float: right;width: 410px;}

สองแถวและสองคอลัมน์ ต่อไปนี้เป็นส่วนของเครื่องหมายคำพูด:
#header{ ความกว้าง: 700px; ขอบขวา: อัตโนมัติ; ขอบซ้าย: อัตโนมัติ; ล้น: อัตโนมัติ;}
#bodycenter { ความกว้าง: 700px; ขอบขวา: อัตโนมัติ;

#bodycenter #dv1 { ลอย: ซ้าย; ความกว้าง: 280px;}
#bodycenter #dv2 { float: right;width: 410px;}

สามแถวและสองคอลัมน์ ต่อไปนี้เป็นส่วนของเครื่องหมายคำพูด:
#header{ ความกว้าง: 700px; ขอบขวา: อัตโนมัติ;
#bodycenter {ความกว้าง: 700px; ขอบซ้าย: อัตโนมัติ;
#bodycenter #dv1 { ลอย: ซ้าย; ความกว้าง: 280px;}
#bodycenter #dv2 { ลอย: ขวา; ความกว้าง: 410px;}
#footer{ width: 700px; margin-right: auto; margin-left: auto; overflow: auto; }

การวางตำแหน่งสัมบูรณ์ของแถวเดียวและสามคอลัมน์:
#left { ตำแหน่ง: สัมบูรณ์; ด้านบน: 0px; ความกว้าง: 120px;
#middle {ระยะขอบ: 20px 190px 20px 190px;
#right {ตำแหน่ง: สัมบูรณ์; ด้านบน: 0px; ความกว้าง: 120px;}

การวางตำแหน่งลอย
xhtml:
นี่คือคำพูด:

CSS : :
นี่คือคำพูด:
#wrap{ ความกว้าง:100%; ความสูง:อัตโนมัติ;}
#column { ลอย: ซ้าย; ความกว้าง: 60%;}
# คอลัมน์ 1 { ลอย: ซ้าย; ความกว้าง: 30%;}
# คอลัมน์ 2 { ลอย: ขวา; ความกว้าง: 30%;}
# คอลัมน์ 3 { ลอย: ขวา; ความกว้าง: 40%;}
.clear{ clear:both;}

ลอยตำแหน่งสอง
xhtml:
ต่อไปนี้เป็นส่วนที่ยกมา:

CSS:
นี่คือคำพูด:
เนื้อความ {ระยะขอบ: 0; ช่องว่างภายในซ้าย: 200px; ช่องว่างภายในด้านขวา: 190px; ความกว้างขั้นต่ำ: 240px;}
.column {ตำแหน่ง: ญาติ;ลอย: ซ้าย;}
#center {ความกว้าง: 100%;}
#left {ความกว้าง: 180px; ขวา: 240px; ขอบซ้าย: -100%;}
#right {width: 130px;margin-right: -100%;}

สองแถวและสามคอลัมน์
xhtml: ต่อไปนี้เป็นส่วนที่ยกมา:

CSS:
นี่คือคำพูด:
#ส่วนหัว{ความกว้าง:100%; ความสูง:อัตโนมัติ;}
#wrap{ ความกว้าง:100%; ความสูง:อัตโนมัติ;}
#column { ลอย: ซ้าย; ความกว้าง: 60%;}
# คอลัมน์ 1 { ลอย: ซ้าย; ความกว้าง: 30%;}
# คอลัมน์ 2 { ลอย: ขวา; ความกว้าง: 30%;}
# คอลัมน์ 3 { ลอย: ขวา; ความกว้าง: 40%;}
.clear{ clear:both;}

สามแถวและสามคอลัมน์
xhtml:
ต่อไปนี้เป็นตัวอย่างเครื่องหมายคำพูด:

CSS:
นี่คือคำพูด:
#ส่วนหัว{ความกว้าง:100%; ความสูง:อัตโนมัติ;}
#wrap{ ความกว้าง:100%; ความสูง:อัตโนมัติ;}
#column { ลอย: ซ้าย; ความกว้าง: 60%;}
# คอลัมน์ 1 { ลอย: ซ้าย; ความกว้าง: 30%;}
# คอลัมน์ 2 { ลอย: ขวา; ความกว้าง: 30%;}
# คอลัมน์ 3 { ลอย: ขวา; ความกว้าง: 40%;}
.clear{ ชัดเจน:ทั้งสอง;}
#ส่วนท้าย{ความกว้าง:100%; ความสูง:อัตโนมัติ;}