Strange error in IE9: <ul> and rtl

First off, sorry for my bad english.

I came across a very strange error, this only happens in Internet Explorer 9.

here is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> html { direction: rtl; } ul li { list-style-image: url(v.gif); direction: rtl; } </style> </head> <body> <ul> <li>I</li> <li>hate</li> <li>IE 9</li> </ul> </body> </html> 

Here is the result:

IE 9 bug

Look at the direction of the image with V!

You can see the error on my website: www.usf.co.il

BTW: This only happens with "direction: rtl".

Does anyone know this error? How can i fix this?

+4
source share
2 answers

This is a strange phenomenon, and it can be classified as an error, since nothing in the CSS specifications suggests such mirroring of images.

The phenomenon seems to occur only in IE 9 in "standard mode", and not in "Quirks mode" or previous versions of IE.

The CSS 2.1 spec sentence in direction says: “This property indicates the main direction of writing blocks and the direction of attachments and overrides (see“ unicode-bidi ”) for the bidirectional Unicode algorithm. In addition, it indicates such as the direction of the position of the columns of the table, the direction of horizontal overflow , the position of the incomplete last line in the block in the case of "text-align: justify". "

Although the wording is somewhat weakened, I do not think you can read its reflection. The expression "investment direction" refers to the implementation of bidi (LTR text inside RTL text or vice versa), and not embedded content, such as images.

The IE documentation for IE does not seem to contain references to this function.

This feature probably represents the idea of ​​supporting RTL recording in the same way that some characters are mirrored. This is not a crazy idea, but it is harmful because it is not based on the specification and does not differ from the practice of the browser.

I am afraid this is a difficult mistake to get around. Using a browser that sniffs and serves up a mirror image in IE 9 (so that when it reflects it, you get the right image) sounds awful, and you'll also need a way to distinguish between “standard mode”.

+4
source

I ran into the same problem. My current solution is to create a reverse image and do the following in HTML

 <!--[if IE 9]> <style type="text/css"> ul li {list-style-image: url("v_reversed.gif");} </style> <![endif]--> 

Does anyone know what is going on in IE10?

0
source

All Articles