unable to show height 100% in firefox

**jacks_bfa** · 07-27-2010, 03:08 PM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="main.css" />
</head>
<body>
<div id="wrapper_main">
<div class="header">here will come here</div>
<div class="content_area">
<div class="left_col">
<iframe width="196" height="100%" class="for_min_hight" scrolling="yes" src="http://www.google.com"></iframe>
</div>
<div class="right_col">
<iframe width="790" height="100%" class="for_min_hight" src="http://www.microsoft.com" scrolling="auto"></iframe>
</div>
</div>
<div class="footer">here will come footer<br />
<br />
</div>
</div>
</body>
</html>

**jacks_bfa** · 07-27-2010, 03:09 PM

how can i set <iframe> height 100%, it's not working in firefox

**traq** · 07-27-2010, 08:33 PM

You did set it to 100%.

That means that the height should be the same as the height of it's container, in this case, #left_col or #right_col.

Do you want the iframes to be 100% of the window size? If so, you'd need to make every parent element 100% in height also, up to the <body> element. After that, you might have some problems with (browser default) padding and margins; so you might have to change those to 0.

Let me know what you want it to look like, exactly.

**jacks_bfa** · 07-28-2010, 06:11 AM

i trying to streatch iframe 100% as per the data. if the page height increase scroll should to come on the browser right site not in the iframe right side.

please give the solution.

**traq** · 07-28-2010, 02:39 PM

Do you want your layout to look something like this?

**Sciamano72** · 03-14-2013, 02:17 PM

Originally Posted by traq

Do you want your layout to look something like this?

This is exactly what I'm trying to achieve (except for the fact that the middle section is another iframe, and all the three iframes can scroll if content height is >100%) but can't.
Please check here, for my thread on this:

http://www.dynamicdrive.com/forums/s...d=1#post291970

Thanks!!

**traq** · 03-14-2013, 05:43 PM

There's a number of three-column layouts in the DD CSS Library. Just put one iframe in each column. You can leave out the header/footer if you don't want them.

**molendijk** · 03-15-2013, 11:41 AM

Originally Posted by jacks_bfa

i trying to streatch iframe 100% as per the data. if the page height increase scroll should to come on the browser right site not in the iframe right side.

please give the solution.

What you want is not possible for iframes loading a page from a 'foreign' domain. You can't auto(re)size them.

**Brijesh Patel** · 03-19-2013, 10:32 AM

Please Try this code for the same

html,body{height:100%}

and replace the following line:

*height:auto !important;

with:

height:100%;

thanks

Thread: unable to show height 100% in firefox

Thread Tools

Search Thread

unable to show height 100% in firefox

how can i streatch iframe 100% as per the data

Bookmarks

Bookmarks

Posting Permissions