Iframe fit to screen

0 Views

I am trying to integrate my blog into my website via iframe. However, using this method I have to give the height and width in pixels. I want the blog to fit the screen, though. Is there any way to do this?

EDIT: The answer below suggests that I change my CSS. Then what do I do with the “width” and “height” variables in my html? Here is the full html code of the page.

Read More
<!DOCTYPE html>
<html>

<head>
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	<title>Shiloh Janowick's Blog!</title>
	<link rel="shortcut icon" href="pics/favicon.ico" type="image/x-icon">
	<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
	<meta http-equiv="Pragma" content="no-cache" />
	<meta http-equiv="Expires" content="0" />
</head>

<body>

	<iframe width="" height="" src="http://shilohgameblog.wordpress.com" frameborder="0" allowfullscreen></iframe>

</body>

</html>

I left the width and height unspecified because I have no idea what to put in them afterwards.

Post Views: 0

Related posts

3 comments

  1. Try this one .
    It works great for me.

        body {
        margin: 0;
        padding: 0;
    }

    iframe {
        display: block;
        width: 100vw;
        height: 100vh;
        max-width: 100%;
        margin: 0;
        padding: 0;
        border: 0 none;
        box-sizing: border-box;
    }

  2. Yes, to get full screen use this code on your css:

    html, body, div, object, iframe, fieldset { 
margin: 0; 
padding: 0; 
border: 0;

    }

    EDIT: Including that on your CSS at the end your html code has to be like this:

    <iframe src="http://shilohgameblog.wordpress.com"></iframe>

    You need to take off everything else on the HTML code because you already put that on your CSS

  3. If you want to make an iFrame the width of the page (so it’s responsive) all you need to do is this:

    <iframe width="100%" height="315" src="https://www.youtube.com/embed/ENTERVIDEOID" frameborder="0" allowfullscreen></iframe>

    I’ve done this with a YouTube video, but you can do this without interfering with anything else. You can also change the height to 100%.

Comments are closed.