Force Merchant to output the W3C DOCTYPE before the <html> tag.

If you fine this page helpful, then lets promote each other.
Exchange links with me, Click here.  Thanks, Ray
 

Developer Documents by Ray Yates
Important Developer Documentation -- Add these links to your favorites. You will need them.
Tutorials
Open Designer user written tutorial. -- Concepts, examples and debugging tips.
Open Designer Advanced Technique -- Understanding merchant screens forms
Adding the W3C DOCTYPE to Miva Merchant output.
Miva Merchants Nested Tables Diagram -- Understanding Merchant/OpenUI layout
Cross Reference Listings
Open Designer Object Dependents -- Cross Reference list of object relationships.
OpenUI Token Shortcuts -- A list of most token shortcuts available in OUI.
OpenUI Module -- Open Designer Cross Reference -- Hookpoints, Module, Function, Screen Code, Object.

 

Created 6/15/2004
Last Updated 05/04/2005

Contents

Credits

This technique was originated in February of 2003 by Tom Smith and posted to the Miva Lists. You can read the original posting here. http://www.mvdevelopment.com/mvlists2/10/53898.html. 

The Problem

Internet Explorer (IE) even up to the latest 6.0 does NOT correctly interpret CSS when it comes to the display: command. In some ways what it does makes more sense but the point is it is not to the W3C CSS specification for styles so rendering across browsers is inconsistent at best and in come cases, breaks all-together. If you would like to check your pages for conformance to the specs you can use the W3C CSS Validator.

Consider this code:
<div style="display: block; width: 200px; height: 200px; border-style: solid; border-width: 1; padding: 4px">
Hello world.
</div>

In IE this creates a bordered area 200 x 200 pixels, like a table. Subtract the border and padding and you have a usable area of 190 x 190 pixels for your content. In Netscape the same code creates a bordered 210 x 210 pixel area. The usable area for your content is 200 x 200 pixels then it adds the border and padding to come up with the total. This may not be intuitive but IT IS TO THE W3C SPEC. This may seem trivial, but believe me it can create some really ugly pages across browsers on your perfectly spaced page and navigation layouts.

Fortunately there is a way to fix the problem. If you add the DOCTYPE before the <html> tag IE will interpret the CSS code correctly and your site will be more consistently presented across browsers. Unfortunately, the <html> is hard-coded into merchant.mvc. Fortunately again, there is a way around that. Thanks go to Darren Ehlers of OpenUI for providing this information.

The Solution

Create and compile a text file called merchant.mv which contains this.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<MvDO FILE = "merchant1.mvc">

That’s it!

Browsed to your site and viewed source. You should see the DOCTYPE line as the first thing on each page.

Warning: If you have used CSS throughout your site you may suddenly find subtle or not so subtle changes on your pages when browsing with IE because you’ve told IE to interpret the page to the spec instead of to it’s own internal standards.

The Better Solution

In the root of your website create this file doctype.html and declare any doctype you like then, create and compile a new merchant.mv which contains this.

<MvCALL ACTION="{ 'http://' $ s.http_host $ '/doctype.html' }" METHOD="GET"><MvEVAL EXPR="{callvalue}"></MvCALL>
<MvDO FILE="merchant1.mvc">

Downloads

Here are the files I used for both compiled and un-compiled stores. download zip file.

 

Hit Counter