ปัญหาการแสดงผลตารางบน Internet Explorer เพี้ยน Table ie7 Error

ปัญหาการแสดงผลตารางบน Internet Explorer เพี้ยน Table ie7 Error

PHP CODE FATHER โปรแกรมช่วยสร้างโค้ด โปรเจ็ค PHP+MySQL+Boostrap ใช้งานง่าย ๆ


การแสดงผลบน ie นั้น นับได้ว่าเป็นปัญหากับบรรดาเว็บโปรแกรมเมอร์
และผู้ที่อยู่ในวงการทำเว็บไซต์มาโดยตลอด และวันนี้ผมเองก็ได้เจอมากับตัวเอง
ทั้ง ๆ ที่ไม่น่าจะเกิดขึ้น แต่มันก็เกิดขึ้นแล้ว

เพียงแค่การแสดงตาราง หรือ table นั้น ie ยังแสดงออกมาได้เพียนเลย
แล้วนับประสาอะไรกับส่วนอื่น ๆ แต่อย่างไรผู้ใช้งานอินเตอร์เน็ตส่วนใหญ่ก็ยังชื่นชอบ(หรือเปล่า)
และนิยมใช้งาน ie กันมากที่สุดในตอนนี้ ดังนั้นในฐานะที่เราเป็นผู้พัฒนาเว็บไซต์
จึงจำเป็นอย่างยิ่งที่จะต้องทำให้เว็บไซต์ที่พัฒนาขึ้นมา สามารถแสดงผลกับ ie ได้อย่างถูกต้อง หรือไม่ก็ผิดเพี้ยนน้อยที่สุด

ตัวอย่างการแสดงผลใน Chrome & Firefox

จะเห็นว่าการแสดงผลถูกต้องและสวยงามตามที่เราออกแบบไว้
ทีนี้มาดูการแสดงผลกับ ie เจ้าปัญหาของเราบ้าง


หน้าเว็บผิดเพี้ยนอย่างแรง ทั้ง ๆ ที่โค้ดก็ตัวเดียวกัน กำหนดความกว้างของแต่ละตารางแล้วแท้ ๆ
แต่น้อง ie เขาก็ยังไม่เข้าใจเราอีก แต่ความไปอย่างอื่นซะงั้น เอาใจยากจริง ๆ

แต่ปัญหาก็มีเอาไว้แก้ใช่ไหมครับ ก็เพียงแค่ไปถามพี่ใหญ่ (กูเกิ้ล) ว่ามีวิธีแก้ไหม และแก้ไขอย่างไร
ก็ได้วิธีแก้ไขปัญหานี้มา ซึ่งก็ไม่ได้อยากเย็นอะไร เพียงแค่ใส่คำสั่งนี้ลงไปในตารางของเรา
เราก็จะสามารถกำหนดค่าความกว้างของตารางได้ตามที่เราต้องการแล้วครับ

table-layout: fixed;

ตัวอย่างการใช้งาน
style="table-layout: fixed; width:180px;">

ใครที่เจอปัญหานี้อยู่ ก็ลองเอาไปใช้กันดูนะครับ แต่สำหรับ ie เวอร์ชั่นอื่น ๆ นั้น ผมเองก็ยังไม่ได้เทส

ปล.ในขั้นตอนการออกแบบเว็บไซต์นั้น ถ้าจะให้ดี เราควรจะทำหรือ เทสระบบผ่าน ie นะครับ
จะได้ทำทีเดียวจบไปเลย ถ้าเทสผ่าน Chrome หรือ Firefox แต่แรก แล้วปัญหากับ ie ก็เกิดขึ้นตามมาได้...

ย้อนกลับ กลับหน้าแรก