www.webdeveloper.com
Results 1 to 2 of 2

Thread: HTML website browser compatibility

  1. #1
    Join Date
    Mar 2012
    Posts
    3

    HTML website browser compatibility

    I have some problems with designing a website and I have no idea how to solve them. The main problem is browser compatibility. Here is the HTML code, it also includes 2 css files and one javascript file which I won't post since they would probably take too much space.

    <html>

    <head>
    <title>Quote genrator</title>
    <meta name="keywords" content="quotes">
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">

    <link href="style.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    @import url(menu/menu_style.css);
    </style>
    </head>

    <body>

    <div id="page">
    <a href="ch25.html"><IMG class="logo" SRC="images/logo2.png" height=70 alt="images/logo2.png"></a>
    <br>

    <ul id="menu">

    <li><a href="#" title="Home">Home</a></li>

    <li><a href="#" title="About us">About us</a></li>

    <li><a href="#" title="Disclaimer">Disclaimer</a></li>

    <li><a href="#" title="Contact us">Contact us</a></li>

    <li><a href="#" title="Submit a qoute">Submit a quote</a></li>
    </ul>


    <p class="margin big auto">How do you feel about this quote<br>
    <span style="color:black"><script src="quotes.js" type="text/javascript"></script></span> </p>

    <div style="top: 370; position: absolute; visibility: show;">
    <span style="cursorointer"><a href="ChAcc.html"><IMG class="margin opacity" SRC="images/smf.png" height=70

    alt="images/smf.png"></a></span>
    </div>

    <div style="top: 370; left: 150; position: absolute; visibility: show;">
    <span style="cursorointer"><a href="ch25.html"><IMG class="margin opacity" SRC="images/saf.png" height=70

    alt="images/saf.png"></a></span>
    </div>
    </div>

    </body>

    </html>


    Here are screenshots of my website:

    1. firefox
    http://img40.imageshack.us/img40/5485/13162041.png

    2. internet explorer:
    http://img861.imageshack.us/img861/8895/30286878.png

    I would like the site to be seen in IE the same way as it is seen in FX but the problem is that IE doesn't detect javascript code, two images and positions #page (the white part) on the left side.
    I have tried to solve this problem with DOCTYPE tags but can't seem to find the right one. Any suggestions?

  2. #2
    Join Date
    Mar 2011
    Posts
    1,136
    For maximum cross-browser compatibility, you always want to use a complete <!DOCTYPE> statement to set them to "Standards Compliance Mode". So at least they're *trying* to adhere to the same standard. Your code is written in HTML 4, so that's where to start. Try:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    Leave this <!DOCTYPE> in place while you edit your page. Don't try adding and removing it. The various browsers behave quite differently without a complete <!DOCTYPE>.
    Rick Trethewey
    Rainbo Design

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles