iframe body remove space

html, iframe, margin, styles, width

Solution

You should do some like:

body{margin:0} // remove body margin

iframe{margin:0;width:100%}//remove iframe margin

p,div{margin:10px} //append margin to p and other tags

Demo for your case:

<!DOCTYPE html>
<html>
<head>
<style>
    body{margin:0}
    iframe{margin:0;width:100%}
    p{margin:10px}
</style>
</head>
<body>
    <p> hello </p>
    <iframe src="http://www.weather.com" style="width:100%; height:95%; margin:0px"></iframe>
</body>
</html>

Problem

My iframe a style of `style="width:100%"`, and it almost covers the page width. But it leaves a small margin on the left and right side. So I added `body { margin:0px; }` to remove the space. It works, but the problem is that removing the margin on `<body>` affects other things, for example a paragraph `<p>` inside `<body>`. Is there a way to eliminate the margin only for the `<iframe>`? Code: ``` <!DOCTYPE html> <html> <body> <p> hello </p> <iframe src="http://www.weather.com" style="width:100%; height:95%; margin:0px"></iframe> </body> </html> ```

Original source