CSS/HTML5 equivilent to iframe marginheight and marginwidth

怎甘沉沦 提交于 2019-12-19 17:13:25

问题


I am doing a website layout for a company who uses IDevAdManager for rotating ads on their site. Unfortunately, I am not much of an expert in that field, so I can't give much on that. What I can say for sure though, due to the nature of the generator, the source inside the iframes it generates are not editable by me.

Now, here is my problem.

I am trying to make their new website HTML5 compliant, but I have reached an interesting issue.

When it comes to adding the iframes from the ad rotator, it generates all of the old, depreciated tags used by previous implementations of HTML.

Obviously, most of this is removable with CSS. All except, however, for the marginheight and marginwidth attributes.

Here is where I reach my problem. There does not seem to be a CSS equivalent to either marginheight or margin width, and there is no way to access the source within the iframes. However, leaving them out prevents the inner content from lining up properly.

I am hoping to find a solution that is both valid HTML5, and solves my problem.

Does such an option currently exist? Or will I have to use the deprecated tags until a solution is designed?


回答1:


Actually this is a valid question. Unfortunately it turns out that the marginheight, marginwidth and frameborder are properties of the iframe element itself, not the element's style property see http://www.w3schools.com/jsref/prop_frame_marginheight.asp

So, for example, you can do this in JavaScript:-

document.getElementById("SomeIframe").marginheight = "0";

but you CANNOT do this

document.getElementById("SomeIframe").style.marginheight = "0";

and setting the margin has NO EFFECT (i.e. you will still get the default margin in the iframe element):-

document.getElementById("SomeIframe").style.margin = "0";

So the answer to cbright6062's question is that there is no way to set the marginheight, marginwidth and frameborder properties of an iframe in a style sheet.




回答2:


To be HTML5 valid the document inside the iframe has to get the correct style, not the iframe itself. I don't know that adManager thing but it depends on how the iframe is created.

If it is dynamic and sameorigin you can enter it by

document.getElementById("SomeIframe").contentDocument;

and set margin by style to 0.

let myFrameBody = document.getElementById("SomeIframe").contentDocument.querySelector('body');
myFrameBody.style.margin = 0;

If it is not sameorigin the owner of the document has to set this by himself, and that is never a bad idea, and also regarding HTML4.1 this would be considered valid.




回答3:


Bit late to the party, but using css to set the padding of the iframe ought to do the trick.



来源:https://stackoverflow.com/questions/9286888/css-html5-equivilent-to-iframe-marginheight-and-marginwidth

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!