将边距应用于除iframe之外的所有边距

时间:2022-11-12 10:23:23

I have a ‘page a’ using ‘css a’. This page has margins set in css. I also have a ‘page b’ using ‘css b’. This page also has margins set in css, of the same size as in ‘css a’ (10px).

我有一个'页面''使用'css a'。此页面的边距设置为css。我还有一个'页面b'使用'css b'。此页面的边距也设置为css,大小与'css a'(10px)相同。

Is there any way I can make it so that when I am viewing ‘page a’ on its own it has margins, but when viewed in an iframe on ‘page b’ the margins don’t apply to ‘page a’. I know that’s kind of a long way of asking but the basic problem is that I am getting ‘double margins’ for the content in the iframe: the margin from ‘page a’ and then the margin from ‘page b’!

我有什么方法可以做到这一点,以便当我自己查看'page a'时它有边距,但是当在'page b'上的iframe中查看时,边距不适用于'page a'。我知道这是一个很长的问题,但基本的问题是,我在iframe的内容中得到了“双倍余量”:来自“页面a”的边距,然后来自“页面b”的边距!

I guess one way of doing it would be to set the iframe not to be affected by ‘page a’s’ margins. Is there some way I can set ‘css a’ to exclude the iframe from the margins, that way only the margins from css b would apply and the page would still be in alignment. is that possible?

我想一种方法是设置iframe不受'page a''边距的影响。有没有什么方法可以设置'css a'来从边距中排除iframe,这样只会应用来自css b的边距,页面仍然会对齐。那可能吗?

Thanks for any help

谢谢你的帮助

Matt

4 个解决方案

#1


1  

You can use Javascript to change the margins if the page is inside an iframe.

如果页面位于iframe内,您可以使用Javascript更改边距。

#2


1  

I don't know a way of specifying it from within a.css, but if you add the following to b.css:

我不知道从a.css中指定它的方法,但如果你将以下内容添加到b.css:

iframe { margin:-10px; }

...it may work.

......它可能会奏效。

EDIT: Is the iframe with a.html the only item contained within b.html?
Do you have test files?

编辑:带有a.html的iframe是b.html中包含的唯一项目吗?你有测试文件吗?

EDIT(2): In css, you would specify it as

编辑(2):在CSS中,您将其指定为

iframe#head { ...; }

Also, I think you can comment on responses to your own questions. I could with mine.

此外,我认为您可以评论对您自己的问题的回答。我可以和我一起

#3


1  

Im really sorry i know everyone gets very upset with posting answers rather than comments im new to stack overflow and just learning. Have mercy! I have figured out what i was doing wrong and now i have this 'open id' thing i will try to post in the right place. I'm afraid this time though i have to post as an answer as i started this question without my open id and so still cant comment on that stuff....

我真的很抱歉,我知道每个人都对发布答案感到非常沮丧,而不是新的堆栈溢出和学习的评论。怜悯!我已经弄清楚我做错了什么,现在我有这个'开放id'的东西,我会尝试在正确的地方发布。我害怕这一次,虽然我必须发布作为答案,因为我开始这个问题没有我的开放ID,所以仍然无法评论那些东西....

OK now thats out of the way here is a 'test case' : http://cart3.jaspers-sensations.com/test/pagea.html

好了,现在这就是一个'测试用例':http://cart3.jaspers-sensations.com/test/pagea.html

Page b is : http://cart3.jaspers-sensations.com/test/pageb.html css a is : http://cart3.jaspers-sensations.com/test/stylea.css css b is : http://cart3.jaspers-sensations.com/test/styleb.css

页面b是:http://cart3.jaspers-sensations.com/test/pageb.html css a是:http://cart3.jaspers-sensations.com/test/stylea.css css b是:http:// cart3.jaspers-sensations.com/test/styleb.css

#4


1  

Having read your clarification, I don't think you can do that purely with CSS. I'm pretty sure CSS can't go across frames.

在阅读了您的澄清之后,我认为您不能仅仅使用CSS来做到这一点。我很确定CSS无法跨越帧。

You should be able to do this using JavaScript, though, provided both documents are on the same domain.

但是,如果两个文档都在同一个域中,您应该能够使用JavaScript执行此操作。

For example, this should work on your example page. Add the following attribute to the <iframe>:

例如,这应该适用于您的示例页面。将以下属性添加到

 onload="window.frames[0].document.body.style.margin = 0"

That works in Firefox 3 and Opera 9, at least. But it's decidedly old-school JavaScript, and considering my browsers were being a bit fickle in which variants worked, I'm not sure how easy that would be to apply to the real site.

这至少在Firefox 3和Opera 9中有效。但它确实是老式的JavaScript,并且考虑到我的浏览器在变体工作方面有点变幻无常,我不确定应用于真实网站会有多容易。

People more well-versed in JavaScript than me should be able to help out there.

比我更精通JavaScript的人应该能够提供帮助。

This might help some more:

这可能会有所帮助:

#1


1  

You can use Javascript to change the margins if the page is inside an iframe.

如果页面位于iframe内,您可以使用Javascript更改边距。

#2


1  

I don't know a way of specifying it from within a.css, but if you add the following to b.css:

我不知道从a.css中指定它的方法,但如果你将以下内容添加到b.css:

iframe { margin:-10px; }

...it may work.

......它可能会奏效。

EDIT: Is the iframe with a.html the only item contained within b.html?
Do you have test files?

编辑:带有a.html的iframe是b.html中包含的唯一项目吗?你有测试文件吗?

EDIT(2): In css, you would specify it as

编辑(2):在CSS中,您将其指定为

iframe#head { ...; }

Also, I think you can comment on responses to your own questions. I could with mine.

此外,我认为您可以评论对您自己的问题的回答。我可以和我一起

#3


1  

Im really sorry i know everyone gets very upset with posting answers rather than comments im new to stack overflow and just learning. Have mercy! I have figured out what i was doing wrong and now i have this 'open id' thing i will try to post in the right place. I'm afraid this time though i have to post as an answer as i started this question without my open id and so still cant comment on that stuff....

我真的很抱歉,我知道每个人都对发布答案感到非常沮丧,而不是新的堆栈溢出和学习的评论。怜悯!我已经弄清楚我做错了什么,现在我有这个'开放id'的东西,我会尝试在正确的地方发布。我害怕这一次,虽然我必须发布作为答案,因为我开始这个问题没有我的开放ID,所以仍然无法评论那些东西....

OK now thats out of the way here is a 'test case' : http://cart3.jaspers-sensations.com/test/pagea.html

好了,现在这就是一个'测试用例':http://cart3.jaspers-sensations.com/test/pagea.html

Page b is : http://cart3.jaspers-sensations.com/test/pageb.html css a is : http://cart3.jaspers-sensations.com/test/stylea.css css b is : http://cart3.jaspers-sensations.com/test/styleb.css

页面b是:http://cart3.jaspers-sensations.com/test/pageb.html css a是:http://cart3.jaspers-sensations.com/test/stylea.css css b是:http:// cart3.jaspers-sensations.com/test/styleb.css

#4


1  

Having read your clarification, I don't think you can do that purely with CSS. I'm pretty sure CSS can't go across frames.

在阅读了您的澄清之后,我认为您不能仅仅使用CSS来做到这一点。我很确定CSS无法跨越帧。

You should be able to do this using JavaScript, though, provided both documents are on the same domain.

但是,如果两个文档都在同一个域中,您应该能够使用JavaScript执行此操作。

For example, this should work on your example page. Add the following attribute to the <iframe>:

例如,这应该适用于您的示例页面。将以下属性添加到

 onload="window.frames[0].document.body.style.margin = 0"

That works in Firefox 3 and Opera 9, at least. But it's decidedly old-school JavaScript, and considering my browsers were being a bit fickle in which variants worked, I'm not sure how easy that would be to apply to the real site.

这至少在Firefox 3和Opera 9中有效。但它确实是老式的JavaScript,并且考虑到我的浏览器在变体工作方面有点变幻无常,我不确定应用于真实网站会有多容易。

People more well-versed in JavaScript than me should be able to help out there.

比我更精通JavaScript的人应该能够提供帮助。

This might help some more:

这可能会有所帮助: