Search code examples
htmlwordpressiframeblogs

Iframe fit to screen

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.

<!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.

Solution

  • 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