เกี่ยวกับปัญหาของ CSS ที่ควบคุมการจัดกึ่งกลางแนวนอนของ DIV ฉันเห็นว่าผู้มาใหม่หลายคนสับสน ฉันจำได้ว่าครั้งแรกที่ฉันอ่าน CSS เป็นหนังสือที่เขียนโดยชาวต่างชาติและพูดถึงการใช้การจัดกึ่งกลาง
ขอบซ้าย:อัตโนมัติ;
ขอบขวา:อัตโนมัติ;
ที่จริงแล้วมันเทียบเท่ากับ:
ระยะขอบ:0 อัตโนมัติ;
ดังนั้นคุณสามารถใช้วิธีนี้ได้ แต่บางคนพบว่ามันไม่ได้อยู่ตรงกลางเมื่อใช้ IE ขอแนะนำให้คุณตรวจสอบว่าคุณไม่มีการประกาศ DTD หรือไม่
<!DOCTYPE html สาธารณะ “-//W3C//DTD XHTML 1.0 การเปลี่ยนผ่าน//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
หลายๆคนเคยทำผิดพลาดเหมือนกัน! วิธีนี้สามารถพูดได้ว่าได้ลองและทดสอบแล้ว แต่ก็ยังใช้ไม่ได้ในบางกรณี ดังนั้นจึงมีวิธีที่สอง
ขอบซ้าย:50%;
ซ้าย: -กว้าง/2;
ความกว้างในที่นี้ไม่ใช่ความกว้างใน CSS แต่เป็นความกว้างของ DIV ของคุณ ตัวอย่างเช่น หาก div ของคุณกว้าง 768px คุณควรตั้งค่าไปทางซ้าย:-384px ดีมาก มีสองวิธีอยู่แล้วซึ่งสามารถกล่าวได้ว่าสามารถแก้ไขปัญหาที่คุณอาจพบได้
บางครั้งคุณจะพบว่าสองสิ่งนี้ไม่เพียงพอ เข้ากันไม่ได้กับเบราว์เซอร์บางตัว ดังนั้นฉันจึงพบวิธีที่สาม ซึ่งส่วนใหญ่จะพิจารณา IE และใช้วิธีแรก มันต้องมีการตั้งค่าร่างกาย
เนื้อความ {จัดข้อความ: กึ่งกลาง;}
ด้วยวิธีนี้ IE จะอยู่ตรงกลางด้วย แต่นำมาซึ่งปัญหาใหม่ คุณพบว่าข้อความทั้งหมดในหน้าของคุณอยู่ตรงกลางซึ่งไม่ดูดี วิธีนี้สามารถแก้ไขได้อย่างง่ายดาย เพียงเพิ่ม text-align: left; และการตั้งค่าการปรับอื่นๆ ให้กับคำจำกัดความ DIV ของคุณ
ข้อความข้างต้นเป็นเพียงการอ้างอิงและภาพร่างหลังอาหารค่ำ ทุกคนสามารถให้ความสนใจได้ในทางปฏิบัติ!