Question

I want to display another website inside a div. It is used to take screenshot of that div. I had to limit the height of the div. How can i do it. I cannot use iframe. Because many sites doesnot support iframe. I am using the below php code to display a website. How can i limit the height (if possible width too)....

<div id="target">
<?php
$url=$_GET['url'];
echo file_get_contents($url);
?>
</div>
Was it helpful?

Solution

Using CSS you can limit the width height of the DIV using, e.g.:

#target{
  width:400px;
  height:400px;
  overflow:hidden; /* optional - or scroll */
}

Note that without using an iframe or pretty complicated techniques you wont end up displaying the content of an external website with anything resembling decent fidelity, less so if it is media/resource heavy.

OTHER TIPS

Hi have you try to add max-width and max-height to your css :

#target{
    max-width:300px;
    max-height:300px;
    overflow: auto;
}

Exemple JSFiddle

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top