Cyberstarweb

Archive for June, 2010

Here is a useful technique to position a page within an iframe using CSS. This allows to show part of a web page within the iframe and positioned to a specific spot on the page within the iframe. Here is an example that shows the “In the News” box on the Yahoo home page:

This is the CSS and html code to accomplish the task:

<style>
#outerdiv
{
width:446px;
height:246px;
overflow:hidden;
position:relative;
}

#inneriframe
{
position:absolute;
top:-412px;
left:-318px;
width:1280px;
height:1200px;
}
</style>
<div id='outerdiv '>
<iframe src="http://www.yahoo.com/" id='inneriframe' scrolling=no >< /iframe>
</div>