ลาก่อน align
float พระเอกของเราครับ property นี้จะมีผลกับ object เจ้าของโดยเทียบกับภายนอกครับ เป็นการจัดตัวเองจากภายนอก มี value ที่สำคัญคือ left right และ none ครับ โดยที่ถ้าเราต้องการจัดให้อยู่ตรงกลางเราจะใช้ value none และต้องกำหนด margin เป็น 0 auto ด้วยครับ
text-align เป็นการกำหนดตำแหน่งของข้อความภายใน object ทีกำหนดครับ ต่างจาก float นะครับ value ทั่วๆไปก็มี left right center ครับ
#center {
float:none;
margin:0 auto;
border:1px solid red;
width:200px;
height:100px;
text-align:center;
}
#left {
float:left;
border:1px solid green;
width:100px;
height:100px;
text-align:left;
}
#right {
float:right;
border:1px solid blue;
width:100px;
height:100px;
text-align:right;
}
CSS ที่ต้องกำหนดครับ
<div id="left">
#left {
float:left;
}
</div>
<div id="right">
#right {
float:right;
}
</div>
<div id="center">
#center {
float:none;
margin:0 auto;
}
</div>
[ex]
#left
#right
#center
[/ex]