การจัดวางตำแหน่งปุ่ม submit ให้อยู่กึ่งกลางด้วย CSS

สมมติว่าเรามี Code html ดังนี้

<form method="post" action="post">
...
...
...

<div>
<input type="submit" name="btnsubmit" id="btnsubmit" 
class="btn" value="ตกลง" />
<div>
</form>

การจะจัดกึ่งกลางปุ่ม submit นั้นมีหลักการดังนี้

• ต้องแสดงเป็น block (display: block;)



• จัดกึ่งกลาง (margin: 0 auto;)



• ต้องกำหนดความกว้าง (width: 150px;)

ดังนั้นเราสามารถกำหนดรูปแบบปุ่ม submit ให้อยู่ตรงกลางได้ดังนี้

input.btn  {
  width: 60px;
  margin: 0 auto;
  display: block;
}

เท่านี้ปุ่ม submit ก็จะอยู่กึ่งกลางสมใจ

ทดลองใน IE8 และ FF3.5 Work ครับ