iframe margin won't go away

Posted on 2006-04-19
Medium Priority
Last Modified: 2008-01-09

I have an empty iframe to which I'm writing text. There is a margin inside the iframe which I can't seem to get rid of. I defined it like:

<iframe id = "something" name = "something" frameborder="0" style="position:absolute; left:5px; top:120px; width:157px; height:310px; border:1px solid black;" marginheight="0px" marginwidth="0px" src="about:blank"></iframe>

So the left margin looks good, it is really 0px - but the top margin is still like 10px, the right margin the same, 10px.

Can I get rid of it?

Question by:minnirok
  • 3
LVL 49

Expert Comment

ID: 16494923
The margin inside the frame you can remove by setting the below style to the document you LOAD INTO the iframe:

<style type="text/css">
body,html {margin:0;padding:0;}

LVL 17

Expert Comment

ID: 16494937
Hi minnirok,

Wow you are up early Roonaan!  Isnt it like 6 in the morning?

Joe P
LVL 49

Expert Comment

ID: 16494957
Yes it is, I have to go to work today, which is about 2,5 hours travel to Amsterdam :-)


Author Comment

ID: 16494961
Hi guys,

I'm not loading any document though into the iframe, it's just:


then I can type text in there with designMode = 'on'.

I'm new at iframes so if I misunderstood please let me know,

LVL 49

Accepted Solution

Roonaan earned 1000 total points
ID: 16494983
Then the only thing I can offer you is to try:
<iframe id = "something" name = "something" frameborder="0" style="position:absolute; left:5px; top:120px; width:157px; height:310px; border:1px solid black; margin:0;padding:0" src="about:blank"></iframe>

Or try setting this thru javascript: document.getElementById('something').document.body.style.margin = 0;


Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…

621 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question