Background Transparent ( filter or opacity ) พื้นหลังกับความกระจ่างใส

มาทำ พื้นหลังให้โปร่งใสกัน ครับ แยกกันนะครับ สำหรับ IE และ Fire fox (อีกแล้วครับ)

IE ใช้
.MessageBackground { filter:alpha(opacity=70); }

Fire Fox ใช้
.MessageBackground { opacity:0.7; }

ยกตัวอย่างมาง่าย ๆ ลองใช้กันดูนะครับ สำหรับ ajax Popup windows

Double margin Bug in IE6 when float

มาละคับ พี่น้องคับ ไม่อยากจะแก้อะไรมากกับ IE6 แต่ว่า โปรแกรมบริษัท จำเป็นต้องซัพพอร์ท ด้วยผู้ใช้หลายคน ยังคงใช้ เวอร์ชั่นคลาสสิคนี้อยู่ เข้าเรื่องเลยละกันครับ เรื่องมีอยู่ว่า เวลา Float พวก ออบเจ๊ค ทั้งหลาย แล้วใส่ margin เข้าไปเนี่ย Browser อื่น ก็ปกติ แต่ ie6 จะแถม margin ให้เป็นสองเท่า แต่ก็มีทางแก้ ก็คือ การใช้ display : inline เข้าช่วย โดยต่อเข้าไปจาก Float ละคับ margin ก็จะกว้างเป็นปกติ
อ่านะ แต่ปัญหาไม่ได้หยุดแค่นั้น เมื่อเราจำเป็นต้องซัพพอร์ท FireFox ซึ่ง บางครั้ง การ Float tag anchor จำเป็นต้อง display:block ด้วย แต่ firefox เจ้ากรรมเราไม่ซัพพอร์ท display: inline - block นะสิครับ ซึ่งคำสั่งนี้สงวนโดย IE
คงต้องแยกกันใช้ โดย firefox ให้ใช้ display: -moz-inline-box; แทน ส่วน ie ก็ใช้ display:inline-block; ไปตามปกติ นะครับ

max width and max height Css All Browser

สำหรับการใช้งาน Max Width and Max Height นั้น ใน IE 7 และ Firefox แสดงผลได้ดี ไม่มีปัญหา แต่ว่า IE 6 ไม่ซับพอร์ทอ่ะจิ ทำอย่างไร มาดูกันครับ
(มันไม่ซับพอร์ทเพราะว่า Max Width กับ Max Height มันเป็น Css Version 2 ครับ)

.MaxHeight
{
max-height: 150px;
_height: expression( this.scrollHeight > 150 ? "150px" : "auto" );
}

.MaxWidth
{
max-width: 100px;
_width:expression(document.body.clientWidth > 100? “100px”: “auto” );
}

หรือ

.MaxWidth2
{
max-width: 100px;
_width:expression(this.width > 100? “100px”: “auto” );
}

สำหรับเครื่องหมาย หน้า css มีความหมายดังนี้นะครับ มีไว้สำหรับเบราเซอร์บางตัวเท่านั้น มันเป็นการ hack css ไม่อยากแนะนำครับ เป็นไปได้ เขียน Detect Browser แล้ว ใช้ตัวที่เหมาะกับ Browser นั้น ๆ จะดีกว่าครับ
# สำหรับ IE
_ สำหรับ IE6 และเวอร์ชั่นต่ำกว่า