ตบตา Netscape 4 ด้วย ID Element

คราวที่แล้วพูดถึงการใช้ การเขียน Comment ของ CSS หลอกเจ้าลุง Browser ตัวนี้ไปแล้ว คราวนี้มาว่าต่อด้วยวิธีป่วน ลุง Browser ตัวนี้ต่อ เป็นวิธีที่เรียกว่า “วิธีง่าย ๆ” ก็ได้มั้ง ลุง Browser ตัวนี้เนี่ยแกจะไม่ทำงานกับ ID selector ใดใดที่มีการเขียนให้เรียกใช้แบบ จำเพาะเจาะจง งงมั้ยครับ ดูตัวอย่างข้างล่างนี้ละกัน

การเขียน ID Selector แบบธรรมดา ทั่วไป:

#mailbox {

font-family: sans-serif;

font-size: 12px;

color: #666666;

}

การเขียนแบบจำเพาะเจาะจง

div#mailbox {

font-family: sans-serif;

font-size: 12px;

color: #666666;

}

การเขียนลักษณะนี้ก็คือ ID ที่ชื่อ #mailbox เนี่ยใช้ได้กับ XHTML Tag “div” เท่านั้น ซึ่ง Netscape จะไม่ทำงานกับการเขียนแบบจำเพาะเจาะจงครับ เราก็จะแก้ปัญหาด้วยการเขียน Element CSS ด้วยวิธีนี้ โดยเราจะเริ่มด้วยการเขียนคำสั่งที่ Netscape 4 เข้าใจ ขึ้นก่อน ปิดท้ายด้วย คำสั่งที่ Netscape 4 อ่านไม่เข้าใจ ดังตัวอย่าง :

#dialog h1 { margin-bottom: -18px; }

div#dialog h1 { margin-bottom: 0px; }

#dialog p { margin-top: -18px ;}

div#dialog p { margin-top: 0px ;}

จากตัวอย่าง เป็นการสั่งให้ margin ของ tag <h1> มีค่าเป็น 0px ใน browser ที่พวกเราใช้กันอยู่ทั่วไป แต่ใน Netscape 4 มีค่าเป็น -18px ลองเอาไปเทสกันดูครับว่าได้ผลเหมือนกันไหม ใน Browser ตัวใหม่ ๆ กับคุณลุง มาถึงตรงนี้เพื่อน ๆ คงไม่งงกันแล้วนะครับ ได้ไปอีก 1 วิธีในการจัดการกับลุง รอบหน้าผมจะมาพูดถึงวิธีต่อไปอีกครับ สำหรับรอบนี้พอเท่านี้ก่อน

NOTE:

การเขียน Element ให้ Class Selector แบบจำเพาะเจาะจงนั้นมีปัญหากับใน Netscape 4.8 เช่นกัน คุณจะไม่ได้การแสดงผลใดใด จากการเขียนคำสั่ง Element ในลักษณะนี้

p.green {color: green;}

(CAUTION: ในส่วนนี้ผมลองแล้วมันก็ใช้ได้ปกตินะ แต่หนังสือบอกใช้ไม่ได้ เพื่อน ๆ ช่วยลองด้วยละกัล)

“Do not live … with FEAR !!!”

radiz

(Special Thanks: Nan for all of the “helps” )