how can i make my site looks the same in firefox and IE

yesterday ,i made a link exchange with a guy in the forums ,when we finish it ,he told me my site looks very strange in firefox,and i don't know why.i only use <table> on that part.

 

Tables shift in FF...

To fix add this to your stylesheet...

table { clear: both; }

Code (markup):

Cheers!~

 

what so ever code you type you need to be sure of the fact that the tag you use in the website is compatible to the browsers and you will see that not only in the IE & Firefox it will work fine for all the browsers you can refer to http://www.w3schools.com/html/ where you will know that the code is compatible to which browser

 

i use a admin website system,so the only things i can see the code is that:

<TABLE cellSpacing=0 cellPadding=0 width=778 align=center border=0 >
<TBODY>
<TR>
<TD width=163><IMG height=66 src="images/logo.gif" width=177></TD>
<TD vAlign=bottom width=615>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD vAlign=bottom align=right width="97%" height=35>
<TABLE height=30 cellSpacing=2 cellPadding=2 border=0>
<TBODY>
<TR>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="help_send.dwt">Payment Methods</A></TD>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="help_contact.dwt">Contact Us</A></TD>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="help_copyright.dwt">About Us</A></TD>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="help_safe.dwt">Privacy &amp; Security</A></TD>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="help.dwt?acat=2">FAQ</A></TD>
<TD noWrap><IMG height=14 src="images/items.gif" width=16></TD>
<TD noWrap><A href="shopbbs.dwt">Guestbook</A></TD></TR></TBODY></TABLE></TD>
<TD width="3%">&nbsp;</TD></TR>
<TR>
<TD align=right>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD height=13><IMG height=8 src="images/spacer.gif" width=80></TD>
<TD><IMG height=8 src="images/spacer.gif" width=80></TD>
<TD><IMG height=8 src="images/spacer.gif" width=80></TD>
<TD><IMG height=8 src="images/spacer.gif" width=80></TD>
<TD><IMG height=8 src="images/spacer.gif" width=80></TD></TR>
<TR>
<TD class=menubg vAlign=center height=29><A href="shop.dwt"><BR>Home</A> </TD>
<TD class=menubg><A href="article_list.dwt?acat=1"><BR>News</A></TD>
<TD class=menubg><A href="goods_category.dwt"><BR>Category</A></TD>
<TD class=menubg><A href="goods_search_list.dwt"><BR>All Products </A></TD>
<TD class=menubg><A href="member_home.dwt"><BR>My Account</A></TD>
<TD class=menubg><A href="javascript:temp=window.open('cart.dwt','shopcat','width=900,height=600,scrollbars=yes');temp.focus()"><BR>Cart</A></TD>
<TD>&nbsp;</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
 <tr></TR></TBODY></TABLE></TD>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD bgColor=#91a41c><IMG height=5 src="images/spacer.gif" width=1></TD></TR></TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=0 width="100%" bgColor=#bcd524 border=0>
<TBODY>
<TR>
<TD align=middle height=29>
<TABLE cellSpacing=0 cellPadding=0 width=778 border=0>
<TBODY>
<TR>
<TD>
<!--
<P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <A href="shop.dwt - [mainpage]"><STRONG><U><FONT color=#000000 size=3>English</FONT></U></STRONG></A>
</P>
-->
</TD></TR></TBODY></TABLE></TD></TR>
<TR>
<TD bgColor=#ffffff height=1><IMG height=1 src="images/spacer.gif" width=80></TD></TR></TBODY></TABLE>

Code (markup):

and i don't know how to do..

 

Never, ever use IE as a reference for how things work. It is 12 years behind all others in modern standards and practices. Always, always use ANY other browser to initially test your markup. But the multitude of quirks and bugs in IE are well known, as are the hacks to fix it. Firefox is showing what you wrote. IE makes things up as it goes along.

The markup you show is antiquated and, possibly, invalid. You don't show the complete markup so we don't know if you are using a doctype. Without one, inept IE will go into quirks mode and not attempt to perform like the other far more modern browsers.

You should never use tables to layout a web page. That's what CSS is for.

And tables do NOT shift in Firefox relative to IE.

EDIT: And, in fact, you have 25 HTML errors though more are 'alt' errors than anything else but they need fixing.

 

I have a php control script. i don't know exactly about raw dom elements that can auto comply across browsers. rarely do i use code that breaks in other browsers, i just scrap it. the php script is mostly for embedding font-face - as in one browser uses *.ttf and the other uses *.eot. you may wanna look into a php method I can post the script.

 

hi,thank you for your answer,i know IE is too old,but 90% viewers of my site are useing IE.so i should let them feel good first.than this site which got the problem is not my design.someone use a MOD to make it easy.so i don't know the completely code.the php is locked by zend.the code i can see and edit is that before.so i feel disturb.

 

You could do browser compatibility to check your website to all browsers. Adobe has browserlab which is very good in doing this.

 

It's almost impossible to create your site to be the same in Firefox and Internet Explorer because the last browser is behaving in a weird way with most of the tags in HTML. Hopefully it won't be an issue when HTML 5 is released

 

You are thinking backwards. Since the only way to make web sites work in IE is to write invalid markup, you create more work for yourself by design to IE. Then, when you try and make things work in modern browsers, you'll struggle on a daily basis with your bad code. Even as Microsoft, themselves, are promoting writing proper markup. In fact, you're bad code won't work in IE9 since it attempts to act like the other browsers.

I saw the same thing happen when IE8 came out. People who created their sites using IE7/6 couldn't understand why their sites broke in IE8.

Always, always design to standards, not to browsers, but use the most standards compliant browser to make sure your markup is properly written. That means NOT IE. As I said, the multitude of quirks and bugs in IE are well known, as are the hacks to fix it.

 

It isn't dependent on HTML5. Only the browser implementation. But IE will still be the worst browser on the planet.