CODEWITHSUNDEEP
csshtmlvalidationiframe
Michael Rogers
Michael Rogers

Reputation: 233

Why does HTML5 doesn't validate but doesn't give an alternative either?

I don't understand HTML 5. A validator says:

The marginwidth attribute on the iframe element is obsolete. Use CSS instead.
The marginheight attribute on the iframe element is obsolete. Use CSS instead.

But according to this accepted answer:

there is no way to set the marginheight, marginwidth and frameborder properties of an iframe in a style sheet.

Why do they ask me to do something that is just impossible?

Either put the thing that works in the specification or come up with a real alternative. They appear to have deprecated something and their alternative doesn't work.

What am I missing here?

Upvotes: 5

Views: 2657

Answers (2)

Alohci
Alohci

Reputation: 82986

The HTML5 spec does describe how the marginheight and marginwidth attributes work. What it says is:

For each property in the table below, given a body element, the first attribute that exists maps to the pixel length property on the body element. If none of the attributes for a property are found, or if the value of the attribute that was found cannot be parsed successfully, then a default value of 8px is expected to be used for that property instead.

Property        Source
'margin-top'    body element's marginheight attribute
                The body element's container frame element's marginheight attribute
                body element's topmargin attribute
'margin-right'  body element's marginwidth attribute
                The body element's container frame element's marginwidth attribute
                body element's rightmargin attribute
'margin-bottom' body element's marginheight attribute
                The body element's container frame element's marginheight attribute
                body element's bottommargin attribute
'margin-left'   body element's marginwidth attribute
                The body element's container frame element's marginwidth attribute
                body element's leftmargin attribute

If the body element's Document's browsing context is a nested browsing context, and the browsing context container of that nested browsing context is a frame or iframe element, then the container frame element of the body element is that frame or iframe element. Otherwise, there is no container frame element.

So to achieve the same effect, you must set the CSS margin values on the body element of the contained page, not the CSS margin values of the iframe element.

The spec then goes on to explain why marginwidth and marginheight may not (or even should not) be supported in browsers:

Warning! The above requirements imply that a page can change the margins of another page (including one from another origin) using, for example, an iframe. This is potentially a security risk, as it might in some cases allow an attack to contrive a situation in which a page is rendered not as the author intended, possibly for the purposes of phishing or otherwise misleading the user.

Upvotes: 3

SW4
SW4

Reputation: 71150

I would tend to say you should always remain a bit sceptical of information on W3C.

If you want to boil it down to literals- they are correct- there is no direct equivalent in CSS, however, CSS does provide existing alternatives (which is why neither property is still supported, they are redundant).

marginheight is the top and bottom margin, so just use margin-top and margin-bottom...the same is true for marginwidth, use margin-left and margin-right (or specify all together in margin)

As for frameborder- simply set the border of the iFrame in CSS.

<iframe marginheight='10' marginwidth=20' frameborder='0'>

Can be accomplished in HTML/CSS with:

<iframe>

iframe{
  margin:10px 20px;
  border:none;
}

Upvotes: 0

Related Questions