GORAGOD.com

freelance, web developer, web designer, hosting, domain name

ลาก่อน align

XHTML ยกเลิก property align ไปแล้วครับ ถึงแม้ว่า Browser บางตัวอาจจะยังรู้จักอยู่ มาเรียนรู้การใช้ CSS เพื่อจัดตำแหน่งกันครับ

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
#center
[/ex]
0SHAREFacebookLINE it!
^