Margin remove in html javascript or css

Question

How to remove the white margins from this web page.

Text

Code of webpage:

<html>

<head></head>

<body>
  <iframe id="i1" src="yoursource1.html" width="100%" style="height:100vh"></iframe>
  <iframe id="i2" src="yoursource2.html" width="100%" style="height:100vh"></iframe>
</body>
<html>

metatron · Accepted Answer · 2023-01-18T17:23:13.710

1

iframes have a default display type of inline. Inline elements are initially designed for text and your iframe acts a bit as one giant character. It has a bit of white space beneath for the descenders of the characters (characters like j and g have descenders).

To cut a long story short, try changing the display type with css (and remove the border).

body {
  margin: 0;
}

iframe {
  display: block;
  border: 0;
}

<iframe id="i1" src="yoursource1.html" width="100%" style="height:100vh; background:black"></iframe>
<iframe id="i2" src="yoursource2.html" width="100%" style="height:100vh; background:black"></iframe>

edited Jan 18 '23 at 17:23

answered Jan 18 '23 at 17:05

metatron

896
7
14

Not worked. At least in firefox. – Daniel Figueiredo Jan 18 '23 at 17:18
1

also remove the border :) – metatron Jan 18 '23 at 17:23
Yet not working. More complete code in pastebin https://pastebin.com/9bsD3iPn – Daniel Figueiredo Jan 18 '23 at 17:43
1

now is working very well – Daniel Figueiredo Jan 18 '23 at 17:46

Margin remove in html javascript or css

1 Answers1