Firefox<->IE CSS issue (No margin: auto love in IE)

[GaijinPunch]

I've got a table within a <td>, that is lined up perfectly fine in Firefox, and not in IE. The syntax I'm using is roughly:

<table>
<tr><td>
<table style="margin: auto;">
<tr><td>Cell 1</td><td>Cell 2</td></tr>
</table>
</tr></td>
</table>

here's a link:

http://www.gamengai.com/test.php

I've put a red border on the td, and a green one on the embedded table to clearly illustrate.

Any trick here I'm missing?

 

[cLFlaVA]

not sure specifically. use this and add your styles one at a time until (if) it breaks:

    <table border="0" style="width: 700px; border: 1px solid green;"><tr>
        <td style="width: 500px; text-align: center;">
            <table border="0" style="border: 1px solid red;"><tr>
                <td>Cell 1</td>
                <td>Cell 2</td>
            </tr></table>
        </td>
        <td style="width: 200px;"></td>
    </tr></table>

*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[GaijinPunch]

I went w/ the "use a <td> to pad" solution. Would be nice if IE actually worked, but hey, it's M$. What can ya do.

Thanks
GP

 

[GaijinPunch]

Actually... I decided to go with a forced padding solution. I've got various kinds of junk I'm going to put there.... some of which is a hassle to sort and put in properly. Would be more work to pad with extra cells.

 

[BillyRayPreachersSon]

The solution would "roughly" be to not use tables for such a simple layout!

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[GaijinPunch]

The solution would "roughly" be to not use tables for such a simple layout!

It was just an example to make viewing it easy. The end is much more complex.

 

[BillyRayPreachersSon]

But still - if you're using tables purely for layout, and that layout is not for tabular data, then I still say ditch tables and use CSS.

Perhaps you can give details of what your real desired layout is?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[GaijinPunch]

But still - if you're using tables purely for layout, and that layout is not for tabular data, then I still say ditch tables and use CSS.

I can respect that, but the above, very simple discrepency between IE and Firefox should be reason enough to not have a pure CSS solution assuming I don't want a lot of tears, no? Maybe I'm just a black cat, but I've had bad luck getting the two to stay in harmony. I'm not anti-CSS by a stretch... I use it quite a bit, but I try to keep it minimal.

That, and I'm also just changing up a page already in table form... not coding from scratch... otherwise I'd be much more open-minded.

 

[Vragabond]

If you're after pixel perfect design, then it is best to not design for web, because there are just too many browsers out there and they will render your page slightly different. If you are just trying to have it look about the same across most browsers I have always found that CSS does a much better job than tables.

 

[GaijinPunch]

because there are just too many browsers out there and they will render your page slightly different.

Yep, I've notcied that, unfortunately. I'm just looking for that "looks like same" idea. I don't doubt CSS probably does a better job, but I've already got the table code there... and still quite a few more pages to fix.

 

[BillyRayPreachersSon]

Given that most users will surf with one browser, a pixel out here or there will not be noticed.

You've also said that you're after a "looks the same" - and 99% of people would say that a site in two browsers (which might be out by 1 pixel) would "look the same" if they saw them side by side (which, as I've already said, they probably would not, surfing with only one browser).

So why not use CSS and ditch tables?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[GaijinPunch]

So why not use CSS and ditch tables?

At this point, time.

 

[truebluexxx]

I suspect the reason the page is not the same in both browsers is not because M$ are rubbish but simply that the two browsers deal with errors in different ways. I suggest you use

http://validator.w3.org/

to check your code. You will find errors in your code. Some tags are openned and never closed and and some are closed but have not been openned.

Hope that helps.

 

[GaijinPunch]

The code up there now is not what it used to be... hence, the errors. The page validated fine when I had the above problems. I've since found ways around it.