If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Enjoy an ad free experience by logging in. Not a member yet? Register.

Possible to crop an iframe?

Hi I run a very simple, 1 page, calendar site however I would like to crop the bottom of my google calendar iframe. This bottom bit contains the "+ google calendar button" which means competition can easily steal my content...

Negative margins
The negative margins technique allows to center a block for which the dimensions are known.
Centering can be horizontal, vertical or both.
For a container block of 700 px by 400 px. We want it exactly centered within the navigator no matter the definition used (800x600, 1024x768 or more).
The trick is to first place this block at 50&#37; top and 50% left, which will place the upper left corner of the block in the middle of the page.
Then we will define negative margins with a value that is exactly half of the width and height of the block, which will position it exactly in the middle of the page.
Here is the CSS code for the container:
#global {
position:absolute;
left: 50%;
top: 50%;
width: 700px;
height: 400px;
margin-top: -200px; /* half of the height */
margin-left: -350px; /* half of the width */
border: 1px solid #000;
}
Then place the container right below the <body> tag:
<div id="global"></div>
Now the block is centered.(View result here)
Note: Negative vertical margins in CSS seem to be causing problems on Explorer / Mac.
(Liberally inspired from http://bluerobot.com/web/css/center2.html)
Print article
Raphael GOETTER
www.alsacreations.com