IE has always been criticized by advocates of web standards. When Firefox was born, more web page makers began to pay attention to Web standard design. Microsoft finally launched ie7. However, can IE7 really turn the storm, be it truly trusted by users, and be truly recognized by web designers?
See the internet standard of IE7 SeriesArticleTo witness the change in IE7 with you!
Select says to Div: "small! Just step on you !"
This IE6 is a well-known and strange bug, which is very simple and easy to reproduce. To put it bluntly, the list box (select) has always placed the Div under its feet. Because of this bug, I don't know how many floating menus are damaged. This scenario is simulated below, you can runCodeTo view the sample page --
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br/> <HTML xmlns = "http://www.w3.org/1999/xhtml"> <br/> <pead> <br/> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8 "/> <br/> <meta name =" keywords "content =" Yes! B/S !, Web standards, Yang Zhengyi, blog Park, instance code "/> <br/> <meta name =" Description "content =" this is a simple yes! B/S! Article Example page, blog from Yang zhengtao, http://justinyoung.cnblogs.com/"/> <br/> <title> yes! B/S! Article Example page </title> <br/> <style type = "text/CSS"> <br/> # divmenu {<br/> border: 1px solid red; <br/> width: 150px; <br/>}< br/> # divup {<br/> position: absolute; <br/> background-color: red; <br/> width: 100; <br/> Height: 100px; <br/> display: none; <br/>}< br/> </style> <br/> </pead> <br/> <body> <br/> <Div id = "divmenu" onmouseover = "showmenu (); "onmouseout =" hidemenu (); "> This is the menu. </div> <br/> <Div id =" divup "onmouseover =" showm Enu (); "onmouseout =" hidemenu (); "> <br/> <a target =" _ blank "href =" http://www.cnblogs.com "Title =" "> blog </a> <br/> <a target = "_ blank" href = "http://justinyoung.cnblogs.com/" Title = "Yes! B/S! "> Yes! B/S! Blog </a> <br/> <a target = "_ blank" href = "http://space.cnblogs.com/w3c/" Title = "web standards team"> [web standards team] </a> <br //> <br/> </div> <br/> <select id = "ddltest"> <br /> <option> drop-down list item 1 </option> <br/> <option> drop-down list item 2 </option> <br/> <option> drop-down list item 3 </option> <br/> <option> drop-down list item 4 </option> <br/> </SELECT> <br/> <! -- =======================================--> <Br/> </body> <br/> </ptml> <br/> Tip: you can modify the code in the text box before running it.
This is the rendering of the example pages under IE6, IE7, firefox2, Opera (ver9.25), and Safari (windows3.04 --
However, when you move the mouse over the menu and the drop-down menu appears, this strange bug in IE6 appears --
This bug is a frequently asked question: how to make the Layer Cover the drop-down list box? Problem solution. The solution is provided for reference. It is to use IFRAME to press select, and then put DIV in IFRAME. However, this is just like asking Dong Zhuo to enter Beijing to destroy eunuchs. It is too costly. However, in the chaotic world like IE6, there is also no way! If you are interested, you can read the article.
IE7 said: "society is liberated! Div can be turned over as the master"
Now IE7 has fixed this bug. If most of your Web page viewers are already using IE7 and you don't care about the display defects of IE6, you can skip this bug. After all, introducing an IFRAME for such a visual bug is a waste ......
At this point, in the IE7 era, div can finally say in tears: "It's up! Finally, it went up! I am no longer oppressed by the SELECT statement. I don't need to use Dong Zhuo IFRAME. With Div myself and IE7, I finally went up! To express my excitement, I would like to dedicate this couplet to IE7 browsers and thousands of Div compatriots --"
Uplink:The old wolf list box is rampant
Downlink:Today, Web standardization is hosted fairly
Batch:Good IE7
Haha ~ This cool performance may be the sequent effect of the new year Couplet Competition in the blog Park; rz ~
Related Article list
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
