✔ <iframe> nicht 100% Höhe

Status
Nicht offen für weitere Antworten.
Eiszwerg

Eiszwerg

Erfahrenes Mitglied
Hallo helfende Community,

mag mir Jemand erklären, warum das iframe nicht die geforderten 100% an Höhe einnimmt?

HTML: 
<table>
    <tr>
        <td style="vertical-align:top;">
            <p>
                Adressdaten
            </p>
            <p>
                Telefonnummern
            </p>
            <p>
                <strong>&Ouml;ffnungszeiten:</strong>
            </p>
        </td>
        <td>
            <p>
                Hier Bilder
            </p>
        </td>
    </tr>
    <tr>
        <td  style="width:100%; heigth: 100%; vertical-align:top;" colspan="2">
            <iframe src="blub.html" style="widht:100%; height:100%;">
                Ihr Browser unterst&uuml;tzt keine Frames. Bitte updaten!
            </iframe>
        </td>
    </tr>
</table>

In der blub.html ist nur Spam in einem <pre>-Tag. Sollte also nicht stören.

Danke Euch :)
 
HTML: 
<iframe src="blub.html" style="display:block; widht:100%; height:100%;">
bringt keine Änderungen mit sich :confused:
 
Hi!

Gegenmaßnahme Nr. 1:

Code: 
html,body {
height:100%;
}

Gegenmaßnahme Nr. 2:

Code: 
<table style="height: 100%;">
    <tr>
        <td style="vertical-align:top;">
            <p>
                Adressdaten
            </p>
            <p>
                Telefonnummern
            </p>
            <p>
                <strong>&Ouml;ffnungszeiten:</strong>
            </p>
        </td>
        <td>
            <p>
                Hier Bilder
            </p>
        </td>
    </tr>
    <tr>
        <td  style="width:100%; height: 100%; vertical-align:top;" colspan="2">
            <iframe src="blub.htm" style="width:100%; height:100%;">
                Ihr Browser unterst&uuml;tzt keine Frames. Bitte updaten!
            </iframe>
        </td>
    </tr>
</table>
Zudem hast du da einen Buchstabendreher bei der width- und height-Eigenschaft:

Code: 
<td  style="width:100%; heigth: 100%; vertical-align:top;" colspan="2">
            <iframe src="blub.html" style="widht:100%; height:100%;">
 
Nr. 2 funktionierte auf Anhieb. Von Nr. 1 behaupte ich, dass es auch gehen würde ;)

Das mit den Buchstabendrehern passiert mir schon den ganzen Tag :mad:

Ich bedanke mich recht herzlich für die Hilfe :)
 
Hmpf... zu früh gefreut.
Das Beispiel alleine Funktioniert wunderbar, aber wenn ich dieses Beispiel in meine Hauptseite includiere (mittels PHP), dann ist Wurst ;)

Hier mal die Hauptseite:
HTML: 
<body>
    <table class="wrap">
        <tr>
            <td class="head" colspan="3">
                <img src="gfx/head.jpg" />
            </td>
        </tr>
        <tr>
            <td class="aussen">
            </td>
            <td class="main">
            Hier steht das Beispiel drin
            </td>
            <td class="aussen">
            
            </td>
        </tr>
        <tr>
            <td class="footer" colspan="3">
                <!-- <img src="gfx/foot.jpg" /><br /> -->
            </td>
        </tr>
    </table>
</body>

Die CSS dazu sieht wie folgt aus:
HTML: 
body
{
font-family         : arial;
background-color    : #0066CC;
background-image    : url(../gfx/bg.jpg);
background-repeat   : repeat-x;   
}

.wrap
{
width               : 90%;
height              : 100%;
padding             : 10px;
margin              : 10px;
border-collapse     : collapse;
font-size           : 0.8em;
background-color    : #114477;
}

.head
{
text-align          : center;
height              : 150px;
/*background-image    : url(../gfx/head.jpg);*/
border              : 0px solid black;
}

.aussen
{
width               : 20%;
height              : 100%;
padding             : 2px;
vertical-align      : top;
background-color    : #FFCC66;
border              : 0px inset black;
}

.main
{
color               : #000000;
height              : 100%;
padding             : 2px 5px 50px 5px;
vertical-align      : top;
background-color    : #4477AA;
border              : 0px solid black;
}

.footer
{
text-align          : center;
vertical-align      : middle;
color               : #FFFFFF;
font-weight         : bold;
height              : 150px;
/*background-image    : url(../gfx/foot.jpg);*/
border              : 0px solid black;
}

.sub
{
color               : #000000;
width               : 100%;
padding             : 0;
margin              : 0;
border-collapse     : collapse;
font-size           : 0.99em;
}

.sub2
{
color               : #000000;
height              : 100%;
width               : 100%;
padding             : 0;
margin              : 0;
border-collapse     : collapse;
font-size           : 0.99em;
}

Helft mir bitte... bin verzweifelt :confused:
 
Bei mir funktioniert's, wenn ich den ersten Quellcode in den zweiten einfüge.
 
Du meinst die Höhe der äusseren Tabelle?
Die habe ich ja per CSS bereits definiert im .wrap, .aussen und .main
Oder habe ich in Deinem Beispiel Nr.2 etwas übersehen?
 
Was funktioniert denn bei dir nicht? Gibt's evtl. eine Online-Version der Problemseite?
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück