Forum Moderators: open

Message Too Old, No Replies

Webpage OK in IE, off in Mozilla

Page renders as designed in IE but not in Mozilla

         

ddarienzo

11:48 pm on Apr 24, 2007 (gmt 0)

10+ Year Member



I put together a page with a simple table. 800 px, 4 cols. In IE, it displays correctly. In Mozilla, the height of the rows is larger and throws off the whole layout. I have tried numerous alternatives including explictly setting row height, making graphics much smaller that the table size, etc. But they still don't render correctly. I've built the same page from scratch in both front page and dreamweaver, same problem. Any suggestions as to what to look for?

BlobFisk

8:26 am on Apr 25, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi ddarienzo,

Have you played with the padding and border-collapse settings? Also, what have you got in these cells?

The recommended practice is to allow the user agent to handle the width and height of cells and the author should try not to disctate this.

Why not try a <div> based layout instead of using a table?

Robin_reala

12:20 pm on Apr 25, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You might also want to try validating [validator.w3.org] your page to make sure there aren't any little errors that Mozilla's not happy with.

scraptoft

4:40 pm on Apr 25, 2007 (gmt 0)

10+ Year Member



As BlobFisk mentioned. Try playing around with the cells padding and margin.

Also, if you have text wrapped in <h1> or <p> tags etc in the cell then try checking the padding and margins for these too.

Xapti

8:09 pm on Apr 25, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



How about also POSTING YOUR CODE... we can't really help you too much otherwise.

Also realize that IE has hundreds of rendering bugs, and also does things you tell it to, even if it's not valid code.
With proper code, you'll find the opposite situation will happen.

tedster

8:45 pm on Apr 25, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



re: posting code -- do check this reference post first: WebmasterWorld Member Guidelines on Posting Code. [webmasterworld.com]

If you do a bit of work before posting and reduce your code to the minimum needed to reproduce the problem, it helps others zero in on the important issues more easily. And sometime, in trying to reduce things to their basics, you even see the issue reveal itself during that very exercise.

And when we're talking cross-browser issues, always validate before tackling a cross-browser problem, or you can spin in circles with something that cannot work. And validating means you need a DTD. The DTD also affects the way your code is rendered.

Validator URLs

W3C Validator - HTML [validator.w3.org]
W3C Validator - CSS [jigsaw.w3.org]