Hello.
I'm Aleksandar Vacić, professional web developer and wine maker in the making.
Learn more about me or see what I can do for you.
…or what to use instead of iframe in XHTML Strict pages.
I have added some kayak.com ads the other night, to the archive pages related to traveling. These ads are actually full-featured search snippets that allows you to directly search kayak.com database. Very handy things.
Sadly, they are written the old-fashion way, with quirks mode in mind, and worse yet — they are writing nested table tag soup directly into the page — no iframe thingie, like Google AdSense is doing. Thus, when my CSS files got applied to it, the snippet fell apart.
Luckily, the snippet always opens a new window, thus I quickly coded in an iframe in which the snippet is displayed. Which was all dandy…apart from the fact that my pages are XHTML 1.0 Strict, in which iframe is banned element. Jolly.
Correct way to include another HTML page into another is by object. The element which only purpose is to insert any foreign object into nice and structured web page.The standard way of coding an object element is to use appropriate MIME type and add the foreign object’s URL. Naturally, this does not work in IE6 (nor IE7) so I had to look for the infamous clsid value for text/html.
This proved to be quite a task, as I could not find any reference for that and after trying for 10 minutes I gave up and opened regedit, found the clsid branch and started arrowing-down until I found what I needed. After that, it was easy:
This worked like a charm, but in IE (both 6 and 7) it shows with an ugly border and scrollbar, even though the content itself was less than the width and height of the object element. It turned out that I need to specify this in the included page:
.... <body style="border:0;overflow:visible"> ....
With this, you get seamless integration of external .html (or .asp or .php or whatever) into current web page.
[update, Nov 24th] Looking at the code, above, I think that p with the backup content is not really necessary. That would be displayed if for some reson the object could not be displayed. But the object data handler is the browser itself, not some external plugin, thus it is always present. Just object is enough (thus the strike through line in the example above).
[update, Nov 28th] Brad Wright chimed in with a valid argument that object may not be supported in all user agents. Backup content should be used.
Update, June 5, 2008: This post turned to be a hit. I never intended it to be a solution to everything, only to a particular problem I had at the time (I’m not even showing kayak.com ads anymore).
A lot of people add comments that the scrollbar-fix is not working. Note that included page in my case was non-standard tag-soup page, thus the two given styles somehow resolved my issue, without any promises it will work in all cases.
A lot of issues came up in comments for which I don’t have a solution (of the top of my head) nor time and incentive to investigate further. If I ever do, I’ll write it up. In the mean time, you’re on your own.
Translated to: Brazilian-Portuguese (by Mauricio Samy Silva).
Lots of ramblings on this blog...might be easier for you to find your juice through these tags:
Voices from the crowd, 73 so far
by Craig Francis
14 hours, 25 minutes after the post
by Olivier Mengué
16 hours, 21 minutes after the post
by Aleksandar
16 hours, 58 minutes after the post
by Rarkai
22 hours, 11 minutes after the post
by rolandog
1 day after the post
by Tim McCormack
1 day, 4 hours after the post
by Neuromancer
1 day, 5 hours after the post
by Aleksandar
1 day, 15 hours after the post
by Suhas Dhoke
1 day, 16 hours after the post
by Nicolas R
2 days, 6 hours after the post
by Aleksandar
2 days, 15 hours after the post
by Rodrigo
3 days, 1 hour after the post
by Dan
6 days, 2 hours after the post
by Brad Wright
6 days, 2 hours after the post
by things of sorts
6 days, 2 hours after the post
by moge
1 week after the post
by Craig Francis
1 week, 1 day after the post
by madi
1 week, 2 days after the post
by Håvard Pedersen
1 week, 2 days after the post
by jnothing
1 week, 3 days after the post
by jnothing
1 week, 3 days after the post
by Paul Page
1 week, 4 days after the post
by Marc Kirkwood
1 week, 5 days after the post
by alex b
1 week, 6 days after the post
by Sagi B
2 weeks, 6 days after the post
by professional WebDesign barrierefrei
3 weeks, 3 days after the post
by Darren
3 weeks, 5 days after the post
by Michael Müller C. | Diseño y Desarrollo Web, Estándares, CSS, HTML y más! | Guayaquil, Ecuador | Web Design Blog
4 weeks, 1 day after the post
by Blog do Maujor
4 weeks, 1 day after the post
by dwyn
1 month after the post
by Riks
1 month after the post
by Carbonrock
1 month, 1 week after the post
by mynthon
1 month, 2 weeks after the post
by Martin Odhelius
1 month, 2 weeks after the post
by Martin Odhelius
1 month, 2 weeks after the post
by rav
1 month, 3 weeks after the post
by Shawn Souto
1 month, 3 weeks after the post
by Rhys
1 month, 4 weeks after the post
by Webdesign Agentur
2 months, 1 week after the post
by Marco
2 months, 1 week after the post
by Habakuk
2 months, 3 weeks after the post
by Mark
3 months after the post
by Internetagentur Köln
3 months, 1 week after the post
by Tom
3 months, 1 week after the post
by Peter
3 months, 2 weeks after the post
by Mediation Bernadette
4 months, 2 weeks after the post
by Michael
4 months, 3 weeks after the post
by charlot
4 months, 3 weeks after the post
by charlot
4 months, 3 weeks after the post
by charlot
4 months, 3 weeks after the post
by Dom
6 months, 4 weeks after the post
by Jukka
7 months, 1 week after the post
by cast42
8 months, 1 week after the post
by jennifer
10 months, 4 weeks after the post
by Jason Maronge
11 months, 4 weeks after the post
by Best of December 2006 | Best of the Month | Smashing Magazine
12 months after the post
by woz
1 year after the post
by Liam
1 year after the post
by Shaun Hoggan | links for 2008-03-23
1 year, 4 months after the post
by Kalli
1 year, 4 months after the post
by mark
1 year, 6 months after the post
by James cox
1 year, 7 months after the post
by David
1 year, 8 months after the post
by Aleksandar
1 year, 8 months after the post
by patrick
1 year, 11 months after the post
by Cyana
1 year, 11 months after the post
by Mike
1 year, 11 months after the post
by Geetha Jeyalakshmi
1 year, 12 months after the post
by Kevin Campbell
2 years, 2 months after the post
by Ron Bigus
2 years, 2 months after the post
by Urvesh Vekariya
2 years, 3 months after the post
by yenc
2 years, 4 months after the post
by john
2 years, 10 months after the post