เล่าเรื่อง auto ads ทำให้เลย์เอ้าท์ใน fieldset นี้ ผิดเพี้ยนไปจากที่ออกแบบไว้

พบว่า สาเหตุความผิดเพี้ยนของเลย์เอ้าท์มาจาก auto ads ของผู้ให้บริการรายหนึ่ง เมื่อสืบค้นดูก็พบการตั้งคำถามแนวนี้ ในทำนองว่ามี random adding auto ads แล้วทำให้เลย์เอาท์ที่กำหนดไว้เปลี่ยนรูปแบบไปจากที่ออกแบบไว้ ซึ่งการเขียนโค้ดแก้ไข display ตัว ads ในทางเทคนิคแล้ว สามารถทำได้ แต่ไม่ควรทำ เพราะไปขัดนโยบายของผู้ให้บริการ ads และจะทำให้ระบบหยุดบริการแสดง ads ได้
..
ปัญหาเรื่อง เลย์เอาท์ ตาม ภาพที่ 1 พบว่า กล่อง div 3 กล่องด้านล่าง ที่แยก div กับเนื้อหาด้านบน มีการขยายความกว้างอัตโนมัติมากกว่าที่กำหนด เพราะ auto ads ได้มาจองพื้นที่ไว้เพื่อเตรียมแขวนป้ายแสดงสินค้า/บริการแล้ว เนื่องจากได้กำหนดให้ div 3 กล่อง มีความกว้างอัตโนมัติเต็มพื้นที่ที่กำหนด จึงทำให้ div ขยายมากกว่าที่คาดไว้
..
ภาพที่ 2 มีความชัดเจนขึ้น ได้แสดงผลการทำงานของ random adding auto ads ที่แทรกเข้ามาอัตโนมัติ แล้วปรากฎโดยสมบูรณ์ ทำให้ความกว้างขยายออกไปมากกว่าที่กำหนดไว้อย่างชัดเจน
..
ภาพที่ 3 กำหนดความกว้างคงที่ให้กับ div ทั้ง 3 กล่อง ผลคือกล่องไม่ขยายไปตาม auto ads จากนั้นได้ย้าย 3 กล่องไปอยู่รวมกับกล่องเนื้อหา แต่ ads ก็ยังได้เข้ามาแทรกระหว่างกล่อง มีผลให้กล่องเนื้อหาขยายออกอัตโนมัติ แม้ auto ads ยังไม่ปรากฎ แต่ผลการจองพื้นที่ ก็ทำให้กล่องเนื้อหาถูกขยายออกไป
..
วิธีแก้ คือ นำเนื้อหาใส่กล่องที่กำหนดความกว้างคงที่ไว้อีกชั้นหนึ่ง เพื่อให้การแทรก auto ads ไม่มีผลต่อเนื้อหาในกล่องอื่นอีก ซึ่งต้องปรับเปลี่ยนเพื่อการอยู่ร่วมกัน ระหว่างกล่องเนื้อหา กับ ป้ายของผู้สนับสนุน ที่เปรียบเสมือนน้ำหล่อเลี้ยงให้เว็บไซต์ได้มีอายุยืนยาวต่อไป เรียกได้ว่าพากัน win&win ไปด้วยกัน
/web2/

ภาพที่ 1
ภาพที่ 2
ภาพที่ 3