HTML Forum

**Pumpkins_Man** · 01-17-2008, 04:10 AM

hey guys,

i'm new to the forum but i have a feeling i'll become a regular here. hopefully i can help some people out as well as get some help too though.

so i've been working on a little site http://www.countrycrafts.com.au and the layout looks fine in firefox but doesn't look right in IE. from what i've worked out it's the line that has <table width="810" border="0" align="center" cellpadding="0" cellspacing="0"> which is just under my <body> tag.

when i change this from border="0" to border="1" IE displays it majorly different other than the body. eg: http://www.countrycrafts.com.au/border0.htm versus http://www.countrycrafts.com.au/border1.htm

how on earth to i get it to look right in IE with the border="0"?

thanks in advance for your help and suggestions

**ravisatan** · 01-17-2008, 04:35 AM

well, FF and IE are always in conflict
FF adhere to standards whereas IE doesnt
IE is known for lots of bugs pertaining to CSS

to solve your problem, you will need to use CSS

go to http://www.somacon.com/p141.php
you will get ample instructions and learn more how to use table attributes

**Pumpkins_Man** · 01-17-2008, 04:40 AM

okay then. thanks for the link. i'll head off and do some playing around.

it's been really annoying for me. this is the first time i've ever hit a bug like this and i've used tables thousands of times and i've always managed to get them to work relatively easily across most browsers. i bet it's something simple that i've stuffed up!

**Pumpkins_Man** · 01-17-2008, 04:54 AM

i'm getting there slowly! i've worked out that IE plays a little nicer when i change <td width="125" height="29" valign="top" bgcolor="#E0CB7D"><a href="../index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','../images/home-over.gif',1)"><img src="../images/home.gif" alt="Home" name="Home" width="214" height="31" border="0" id="Home" /></a></td>

to
<td width="125" height="29" valign="top" bgcolor="#E0CB7D"><a href="../index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','../images/home-over.gif',1)"><img src="../images/home.gif" alt="Home" name="Home" width="214" height="31" border="0" id="Home" /></a> </td>

does anyone know if IE dislikes <td> tags with only rollover images and no 'content' as such?

**TributeK** · 01-17-2008, 09:10 AM

Hmm.. Maybe you should try not using tables. I know they are like the first thing we all learned back in the day when it comes to building a template, but they are really starting to get useless, becoming more of a headache than anything. Instead, use CSS and <div> tags. You can do anything with CSS and <div> tags that you can with tables, plus some more. If anything, try to move into CSS by using classes and id's with your tables. That way your not putting: cellpadding="0" etc etc.. inside every single <table> and <td> tag. There are plenty of tutorials that will tell you all about CSS and how to use it. Plus, we're always available for questions here. Good luck.

**LadynRed** · 01-17-2008, 12:56 PM

You should also be sure you put a proper DOCTYPE on your pages, it will help with some of the annoying bugs by forcing IE out of quirks mode.

**Pumpkins_Man** · 01-17-2008, 07:59 PM

ahh okay then. i was just using the one that dreamweaver was putting in which was
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

i'd best go and find the right one to put in! cheers!

**Pumpkins_Man** · 01-17-2008, 08:03 PM

i'm guessing by the looks of it
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> is the best one yes?

**Pumpkins_Man** · 01-17-2008, 08:48 PM

LadynRed,

you'll be pleased to know that i've decided to ditch tables completely in future and it'll be divs all the way now! i read your 'Tables Be Gone!!' comment and did a rethink!

thanks a bunch!

**LadynRed** · 01-18-2008, 10:15 AM

LOL.. well.. I'm glad you made that decision

For a doctype, at the very least I would recommend HTML 4.01 STRICT. It will still force you to write clean, valid code, but it's a tad more forgiving than XHTML Strict.

**svirid** · 01-19-2008, 09:36 PM

I could not find what exactly looks different in IE and FF and not sure what do u have in Safari 3 but before u start any page I would advice you to set proper doctype, I use transitional but strict too much headache.

Also in you css in every page at the very top insert something like this

body, div, span, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, td, iframe {
margin: 0px;
padding: 0px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing:border-box;
font-style: normal;
font-weight: normal;
}

it would make your life easier 100% when u create cross browser pages.

-moz-box-sizing: border-box; makes FF works the way IE does
-webkit-box-sizing: border-box; this line for Safari

Good Luck.

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!