CODEWITHSUNDEEP
htmlcssinternet-explorer-10doctype
ihtus
ihtus

Reputation: 2811

IE10 table row-cell broken (border not continuous)

I have a table and in IE10 I see some broken borders of the rows. Even without border you will see broken row rectangle...

I simplified the issue, here is the source (see in IE10) - http://projects.ihtus.ca/test2/table/

To spot the problem here are the screenshots:

screenshot1: enter image description here

screenshot2: enter image description here

This IE10 is so weird..

My results: If I change doctype to

<!DOCTYPE html>

it shoes ok. But how can I solve it without changing doctype?

EDIT: if you will zoom in (with IE10) - the borders become smooth, and when back to 100% - the problem comes back.

Upvotes: 0

Views: 914

Answers (3)

Syren
Syren

Reputation: 2051

The doctype is what tells IE what rendering engine to use. When you declare an old doctype, you're telling IE to use an older rendering engine i.e. IE7 or IE8. Since you said that changing the doctype fixes it, it could be that without the HTML5 doctype, IE10 is using rendering engine like 7 or 8.

So if you can't change the doctype, you can add this to force IE to use the latest rendering engine possible for the browser 

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

I don't know if it will solve your problem because I don't have an IE10 to test on, but it's worth a shot.

Upvotes: 0

shamsieh76
shamsieh76

Reputation: 123

In most cases, this issue has something to do with your style code/sheets, check your style sheets and ensure that you have : margin:0; padding:0; border:0; outline:0; vertical-align:top; wherever needed.

I would suggest you to start debugging by disabling the reset.css file if you have one, otherwise check that the above mentioned code are applied even for the main DIVs and ULs.

Upvotes: 0

Spudley
Spudley

Reputation: 168695

If you're going to use an XHTML doctype, you must ensure that your code is valid. Failure to do so will result in browser rendering glitches.

Your code has a lot of errors -- see the W3C Validator report -- so it's not surprising that you've got some glitches.

Fix those errors and you might find it works a bit better.

If you switch it to HTML5 doctype, a lot of those errors go away, because the code is valid HTML5 but not valid XHTML.

(There are still some errors under the HTML5 doctype, but much fewer, and less likely to cause rendering errors, though you're using the same IDs multiple times, and that will cause issues if you try to use those IDs in CSS or Javascript)

Upvotes: 1

Related Questions