html - <div> inside <li> is displayed incorrect in IE -
here code:
<!doctype html> <html> <head> <style> li div { border: 1px solid #ff0000; width: 100px; position:relative; white-space: nowrap; overflow: hidden; } </style> </head> <body> <ol> <li> <div>111111111111111111111</div> </li> <li> <div>222222222222222222222</div> </li> </ol> </body> </html>
the page displayed not expected in ie8.
firefox: (ok)
ie8: (wrong)
could explain why?
if remove <!doctype html>
ok, want find reason , prepare via css.
you can add together position relative 'li' tag , alter position relative absolute 'div' tag , add together 'top: 0; left: 0;' div tag.this work fine.
try css:
li { position:relative; } li div { border: 1px solid #ff0000; width: 100px; white-space: nowrap; overflow:hidden; position:absolute; top:0; left:0 }
html css internet-explorer doctype
No comments:
Post a Comment