Beiträge von cachorro

  • Problem: iFrame größer als Weblayout -> wird abgeschnitten

    Hallo.
    Mein Problem klingt eigentlich sehr einfach. Aber ich komme nicht auf die Lösung. Ich habe ein ganz einfaches Weblayout, das so aussieht:

    <body id="body">
    <div id="mainContainer">
    <div id="header">
    </div>
    <div id="containerIframe">
    <iframe frameborder="0" name="inlineInhalt" id="inlineFrameTest" allowtransparency="true">
    <p>Ihr Browser kann leider keine eingebetteten Frames anzeigen</p>
    </iframe>
    </div>
    </div>
    </body>

    Im Maincontainer liegt ein Header, darunter der Container für den iFrame. Der iFrame wird über ein gesondertes Menu geöffnet. Das ist alles kein Problem. Es geht darum, daß ich, wie man an nachfolgendem css sieht, die Seite formatfüllend (100% ohne scroll) haben will und den iFrame im container scrollen will, wenn der Inhalt größer ist als der Frame ist. Ich habe daher alle Höhen auf 100% gestellt und da liegt wohl der Fehler, denn der content wird immer abgeschnitten, wenn er größer als der Frame ist.

    Die Frage ist also, wie ich die Webseite fest und formatfüllend lassen kann und den iFrame scrollbar mache. Ich will ihm aber keine feste Höhe vorgeben, oder muß ich das?

    Da css dazu (vereinfacht):

    #body
    width: 100%;
    height: 100%;
    margin: 0 0 0 0;
    overflow: hidden;
    position: absolute;

    #mainContainer
    width: 1080px;
    height: 100%;
    margin: auto;
    position: relative;
    top: 0px;

    #header
    width: 1080px;
    height: 220px;
    position: relative;
    margin: auto;

    #containerIframe
    width: 850px;
    position: relative;
    visibility: hidden;
    margin-bottom: 20px;
    height: 100%;

    #inlineFrameTest
    width: 100%;
    height: 100%;

    Ich hoffe, ihr könnt mir weiter helfen Einstweilen danke.

    Mit freundlichen Grüßen

    cachorro