user2008608
user2008608

Reputation:

ie 7-8 does not support object tag?

I created my website's header and footer in a separate html file and I am embedding those files in my web pages.

After all the hard work and completing the website I came across an error in IE8. My header and footer are aligned all over the place in IE7 & 8.

<footer>
    <div id="divObjFooter">
        <object data="/footer.html" type="text/html">
            &nbsp;
        </object>
    </div>
</footer>

Update - fixed for any version running html5 Finally found a way to support ie any version.

<!--[if IE]>
            <div id="footer">
                <div id="divObjFooter">
                    <iframe src="footer.html">&nbsp;</iframe>
                </div>
            </div>
        <![endif]-->

        <![if !IE]>     
            <footer>
                <div id="divObjFooter">
                    <object data="footer.html" type="text/html">&nbsp;</object>
                </div>
            </footer>
        <![endif]>

Upvotes: 0

Views: 7490

Answers (4)

user2008608
user2008608

Reputation:

<!--[if IE]>
        <div id="footer">
            <div id="divObjFooter">
                <iframe src="footer.html">&nbsp;</iframe>
            </div>
        </div>
    <![endif]-->

    <![if !IE]>     
        <footer>
            <div id="divObjFooter">
                <object data="footer.html" type="text/html">&nbsp;</object>
            </div>
        </footer>
    <![endif]>

Upvotes: 0

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201588

To answer first the question in the title: IE has supported the object element since IE 4 (though early implementations were lousy). Your problem does not seem to be with that element but with your styling of the footer element – a completely different issue.

The footer element is not supported by IE 7 and IE 8. This matters little as such, since the default effect would be just making the element content a block, and your content is already a block (a div element). What causes the trouble is that you have some CSS rules that set properties on the footer element. This won’t work on IE 7–8, since they do not recognize the element even in the sense of letting you style it.

There is a quick fix: put the following before your first style sheet or reference to any style sheet:

<script>document.createElement('footer')</script>

This is effectively what many “shims” or “polyfills” or whatever you call them are doing, and if you have an issue with footer only, you might use just the quick fix.

Alternatively, set your CSS rules on the div inside, using the #divObjFooter selector.

P.S. Using object (or iframe) to include a footer is possible, but clumsy. It will include an HTML file in a subwindow of the document window, and links won’t work normally etc. If at all possible, it is better to use server side tools, like Server-Side Includes (SSI) or their more advanced counterparts, or page management software.

Upvotes: 0

Eonasdan
Eonasdan

Reputation: 7765

Check the website Can I Use for browser support of HTML5 and CSS3 before you use new tags and selectors against your target audience.

IE<10 supports very little (less then 40%) modern html and css. You will likely have to use modernizr or something similar or simply not use the latest "shiny"

Upvotes: 0

braican
braican

Reputation: 2202

ie8 and earlier do not support HTML5 tags (in your case, the <footer> tag), and therefore do not style them. To get around this, you could simply use div's with id's and style them from there, or, if you want to use the latest and greatest HTML5 stuff, you can use an html5 shiv.

I would recommend the script hosted on Google code: https://code.google.com/p/html5shiv/

Upvotes: 1

Related Questions