Not sure if this hould go here, but ill give it a go:

Im trying to use an i-frame to display site news (not allowed to directly connect to the database, so an i-frame to a page on the other server is the only way). It displays fine in IE, but in FireFox it only displays at about 1/3 the height it should.

http://www.clan-toru.net/index.php?action=news

<? include ("stylesettings.php"); ?>

<table width="100%" height="100%" border="1" cellspacing="1" bordercolor="#000000" bgcolor="#FFFFFF">
  <tr bordercolor="#000000" bgcolor="#E7E3EF">
    <td height="10%" colspan="3"><div align="center"><a href="index.php"><img src="http://www.squallster.co.uk/clantoru/rotate.php" border="0"></a></div></td>
  </tr>
  <tr>
    <td width="15%" valign="top" bordercolor="#000000" bgcolor="#E7E3EF" class="style2">

  <p>
    <? include ("links.php"); ?>
</p>

</td>
<td valign="top" bordercolor="#000000" bgcolor="#E7E3EF"><div align="center" class="style3">

<? $action = $_GET["action"];
if (!$action) {	?>

Welcome to Clan Toru.<br>
<br>
If you're wondering what Clan Toru is, it is a guild created primarily for Guild Wars,
although it may in the future spread to cover other games.<br>
<br>
If you're wondering what Toru means, its short for The Only Real Unicorns. :P

<? };
if ($action == "news") { ?>

<iframe src="http://www.squallster.co.uk/clantoru/news.php" frameborder="0" height="100%" width="100%"></iframe>

<? };

if ($action == "login") {
include	("login.php");
}; ?>

</div>
</td>
<td width="15%" valign="top" bordercolor="#000000" bgcolor="#E7E3EF" class="style2">

<? include ("members.php"); ?>

</td>
  </tr>
</table>

Any help would be greatly appreciated.

    <style type="text/css">div { height:100%; }</style>

    Put that into the appropriate place, worked for me anyways.

      Hmm, put that in, the i-frame loads ok now (although no scroll bar in IE, but ill look at that later)

      But now the banner in the top table cell is refusing to vertical align to the middle :S lol

        Yeah I have the same issues, I use a very complicated JavaScript Menu system which reads all it's info from a database, combined with this stupid Firefox iframe fix it's all messed up.

        If you come up with anything better let me know 🙂

        Browser compability can be such a head-ache at times.

          Well, if you have msn or anything, my details are in my profile, might be able to come up with something together 😛

            In my experience, it's not a stupid Firefox issue, it's a stupid IE6 issue. I had one on a page that was fine in all browsers untill IE6 came along, then all layout went to pot. All height parameters were ignored and everything that had looked wonderfull in IE5, NS6, Firefox etc was all squashed up to the top of the window in IE6. Iframes in a table cell will resize with the table in Firefox as the user adjusts the window size, they will not resize in IE6.

              I style the iframe with style="height:100%", it works in both IE and Opera, but not in Firefox.

              That equals a stupid Firefox 8)

                yup, for once this is Fox letting the side down - there's plenty of mention of the Firefox Iframe Bug if you google.

                  Well, all I changed was a line in the stylesettings.php (what Azala said to) and Firefox now displays the frame fine, fits 100% inside the table cell.

                  But now IE doesnt display the scroll bar, OR let me scroll down any way at all myself.

                  And in both of the browsers, the top cell logo now aligns to the top, instead of the middle as I have tried to specify (and how it used to before adding the "div { height:100%; }" line)

                  This is the stylesettings.php include file:

                  <style type="text/css">
<!--
body {background-color: #E7E3EF;}
.style2 {font-size: 10px; font-family: Verdana;}
.style3 {font-family: Verdana; font-size: 12px;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: underline;}
a:active {text-decoration: none;}
div { height:100%; }
-->
</style>

                  So now I either have the iframe dodgy in FireFox, or I have the dodgy-looking logo in all...unless anyone has any info?

                    Write a Reply...