เมื่อคุณเขียนปุ่ม (อินพุต, ปุ่ม) คุณจะพบสิ่งนั้นภายใต้ IE:
เมื่อจำนวนคำเพิ่มขึ้นระยะห่างระหว่างทั้งสองฝ่ายจะมีขนาดใหญ่ขึ้นและใหญ่ขึ้น
ในสไตล์ XP ของ Win เมื่อจำนวนคำมีขนาดใหญ่จะมีการ jagging รุนแรงทั้งสองด้าน
เหตุผลคืออะไร?
คอลัมน์มาตรฐานเว็บมาตรฐานดั้งเดิมของ Blue Ideal ให้คำตอบ:
1. เมื่อใดก็ตามที่ IE เพิ่มค่าของปุ่มด้วย 4 ไบต์ (2 ตัวอักษรจีน) ความกว้างของระยะขอบทั้งหมดจะถูกสร้างขึ้นทั้งสองด้านของปุ่ม
2. รูปแบบเริ่มต้นของปุ่ม IE (สไตล์ XP) เป็นรูปภาพสี่เหลี่ยมผืนผ้าขนาดคงที่เป็นพื้นหลังดังนั้นเมื่อปุ่มกว้างขึ้นและสูงขึ้นขอบของรูปสี่เหลี่ยมผืนผ้าขนาดคงที่ขนาดคงที่นี้จะปรากฏขึ้นตามธรรมชาติ
เราไม่สามารถแก้ปัญหาที่สองได้ในขณะนี้เว้นแต่ว่าระบบ WIN จะแก้ไขข้อผิดพลาดได้ แต่เรายังสามารถแก้ไขปัญหาแรกได้
ตั้งค่าค่าที่มองเห็นได้ของแอตทริบิวต์ล้นสำหรับองค์ประกอบปุ่มภายใต้ IE (หมายเหตุ: ค่าการขยายช่องว่างจะถูกต้องหลังจากตั้งค่าแอตทริบิวต์ที่มองเห็นได้: แอตทริบิวต์ที่มองเห็นได้) คุณสมบัตินี้ถูกนำมาใช้จริงในบทความล่าสุด "แอปพลิเคชันของคลิปพื้นหลังและพื้นหลัง-ต้นกำเนิด" อย่างไรก็ตามหลังจากอ่าน "ปัญหาปุ่มยืดใน IE" วันนี้ฉันพบว่ามีข้อผิดพลาดเล็ก ๆ - ถ้าคุณวางปุ่มในเซลล์ตารางแม้ว่าปุ่มจะแสดงอย่างถูกต้องความกว้างที่สงวนไว้เดิมไม่เปลี่ยนแปลงและยังคงอยู่ คุณต้องตั้งค่าความกว้างของปุ่มเป็น 0 ใน IE6 (IE7 ยังมีข้อผิดพลาดนี้ แต่ไม่มีวิธีที่ดีในการแก้ปัญหาในขณะนี้)
รหัสแก้ไขสุดท้ายมีดังนี้ (สาธิต):
input.button {padding: 0 .25em; ความกว้าง: อัตโนมัติ; _width: 0; ล้น: มองเห็นได้! เช่น;}