Chase Florell
Chase Florell

Reputation: 47387

Web page displaying as XML in Opera

Opera is displaying my new site as XML and I can't for the life of me figure out why.

Here's what firebug has to say

Server ASP.NET Development Server/10.0.0.0
Date Mon, 08 Nov 2010 22:58:32 GMT
X-AspNet-Version 4.0.30319
X-AspNetMvc-Version 2.0
Content-Encoding gzip
Cache-Control private
Content-Type text/html; charset=utf-8
Content-Length 1835
Connection Close

Here's what W3C has to say

  1. Line 3, column 6: application/xhtml+xml is not an appropriate Content-Type for a document whose root element is not in a namespace.
    • <html>
  2. Line 3, column 6: Unnamespaced element html not allowed in this context. (Suppressing further errors from this subtree.)
    • <html>

Here's the markup

<!DOCTYPE html>
<html>
<head>
    <title>What's happening around you right now! - My App</title>
    <meta content="no" http-equiv="imagetoolbar" />
    <link rel="search" type="application/opensearchdescription+xml" title="My App" href="/assets/xml/opensearch.xml" />
    <link rel="stylesheet" type="text/css" href="/MYREALLYCOOLAPP/Extras/siteMaster.Css/1" />
</head>
<body>
    <div class="page">
        <div id="header">
            <div id="title">
                <div id="urban-now-logo">
                    <a href="/MYREALLYCOOLAPP/" title="My App"><span>My App</span> </a>
                </div>
            </div>
            <div id="logindisplay">
                <span id="logindisplaywrapper"><a href="/MYREALLYCOOLAPP/users/login?go=/MYREALLYCOOLAPP">log in</a> | <a href="/MYREALLYCOOLAPP/modalwindow/selectregion"
                    title="Change Region" class="RegionWindow">Calgary</a> | <a href="/MYREALLYCOOLAPP/about">about</a> | <a href="/MYREALLYCOOLAPP/about/faq">faq</a>
                    <span style="padding-left: 20px;"></span>
                    <form action="/MYREALLYCOOLAPP/search" id="searchForm" method="get">
                    <input id="search-text" name="q" tabindex="1" type="text" maxlength="80" size="28" placeholder="search..." />
                    </form>
                </span>
            </div>
            <div id="menucontainer">
                <div class="floatleft">
                    <ul class="menu">
                        <li><a class="youarehere" href="/MYREALLYCOOLAPP/">Now</a></li>
                        <li><a href="/MYREALLYCOOLAPP/events/coming">Coming</a></li>
                        <li><a href="/MYREALLYCOOLAPP/events/hot">Hot</a></li>
                        <li><a href="/MYREALLYCOOLAPP/tags">Tags</a></li>
                        <li><a href="/MYREALLYCOOLAPP/users">Users</a></li>
                    </ul>
                </div>
                <div class="floatright">
                    <ul class="menu">
                        <li><a href="/MYREALLYCOOLAPP/events/addevent">Add Event</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="clear">
        </div>
        <div id="main">
            <h2>What's Happening Within The Next 24 Hours!</h2>
            <hr />
            <div id="innermain">
                <div class="twocolumn-left">
                    <div id='bingMap' class="largeMap">
                        <noscript>
                            <img src="http://developer.multimap.com/API/map/1.2/OA10091719904371779?zoomFactor=11&amp;width=550&amp;height=400&amp;lat_1=51.18468&amp;lon_1=-114.497999&amp;lat_2=51.169858&amp;lon_2=-114.32549&amp;lat_3=51.083277&amp;lon_3=-114.203964&amp;lat_4=51.063097&amp;lon_4=-114.092031&amp;lat_5=50.939664&amp;lon_5=-113.973568" />
                        </noscript>
                    </div>
                </div>
                <div class="twocolumn-right">
                </div>
            </div>
            <div id="footer">
                <ul id="footernavigation">
                    <li>&#169; 2010 - <a href="/MYREALLYCOOLAPP/">My App</a> - All Rights Reserved</li>
                    <li><span class="colorgreen increasesize-140">&#9632;</span> <a href="/MYREALLYCOOLAPP/about">about</a> | <span class="colorgreen increasesize-140">
                        &#9632;</span> <a href="/MYREALLYCOOLAPP/about/faq">faq</a> | <span class="colorgreen increasesize-140">&#9632;</span> <a href="/MYREALLYCOOLAPP/about/advertise">
                            advertise</a> | <span class="colorgreen increasesize-140">&#9632;</span> <a href="/MYREALLYCOOLAPP/about/legal">legal</a></li>
                </ul>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>
    <script type="text/javascript" src="/MYREALLYCOOLAPP/Extras/MYREALLYCOOLAPP.js/1"></script>
    <script type="text/javascript">
        var zoomLevel = 10
        var json_object = [{ "lat": 51.063097, "lon": -114.092031, "title": "Jubilee Auditorium", "desc": "Some great concerts go down here"}];
    </script>
    <script type="text/javascript" src="/MYREALLYCOOLAPP/Extras/bingmaps.js/1"></script>
</body>
</html>

Basically, when I launch the website in Opera, the top says

This document had no style information.

and then all of my markup is displayed (like xml).

Upvotes: 1

Views: 802

Answers (2)

Alohci
Alohci

Reputation: 82986

It looks like your server is sending the file as text/html to Firefox, but application/xhtml+xml to Opera.

Opera (10.63) has a firebug-like interface you can check this with. Right click on a page to bring up the context menu, select "Inspect Element". Select the "Network" tab and expand the relevant request line. Then open either "Headers" or "Raw" and it will show you the content-type used to send the page to Opera.

To allow Opera to process the page correctly as application/xhtml+xml, add

xmlns="http://www.w3.org/1999/xhtml"

as an attribute to the html element as LukeH says.

Upvotes: 1

LukeH
LukeH

Reputation: 269428

Doesn't your DOCTYPE need to specify the appropriate DTD etc? For example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

And/or do you need to specify a namespace for your <html> element? For example:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

Upvotes: 1

Related Questions