วันเสาร์ที่ 27 กันยายน พ.ศ. 2551

Double margin Bug in IE6 when float

มาละคับ พี่น้องคับ ไม่อยากจะแก้อะไรมากกับ IE6 แต่ว่า โปรแกรมบริษัท จำเป็นต้องซัพพอร์ท ด้วยผู้ใช้หลายคน ยังคงใช้ เวอร์ชั่นคลาสสิคนี้อยู่ เข้าเรื่องเลยละกันครับ เรื่องมีอยู่ว่า เวลา Float พวก ออบเจ๊ค ทั้งหลาย แล้วใส่ margin เข้าไปเนี่ย Browser อื่น ก็ปกติ แต่ ie6 จะแถม margin ให้เป็นสองเท่า แต่ก็มีทางแก้ ก็คือ การใช้ display : inline เข้าช่วย โดยต่อเข้าไปจาก Float ละคับ margin ก็จะกว้างเป็นปกติ
อ่านะ แต่ปัญหาไม่ได้หยุดแค่นั้น เมื่อเราจำเป็นต้องซัพพอร์ท FireFox ซึ่ง บางครั้ง การ Float tag anchor จำเป็นต้อง display:block ด้วย แต่ firefox เจ้ากรรมเราไม่ซัพพอร์ท display: inline - block นะสิครับ ซึ่งคำสั่งนี้สงวนโดย IE
คงต้องแยกกันใช้ โดย firefox ให้ใช้ display: -moz-inline-box; แทน ส่วน ie ก็ใช้ display:inline-block; ไปตามปกติ นะครับ

ไม่มีความคิดเห็น: