Zum Inhalt springen

[CSS] Layout mit festen und variablen Breiten- und Höhenangaben


*I C Q*

Empfohlene Beiträge

...oder auch: Wie sag ich's meinem IE! ;-)

Hallo zusammen,

folgendes Problem:

Ich will für eine Website ein tabellen- und framesetloses Layout auf der Basis von HTML & CSS erstellen. Hierfür habe ich eine vorgegebene Hintergrundgrafik welche auf der linken Seite einen ca. 100px grossen Bereich für die Navigation, oben einen ebenfalls ca. 100px grossen Bereich für das Logo und in der Mitte einen "undefiniert" grossen Bereich für den Content.

Meine Grundidee war, drei DIV-Container (nennen wir sie #nav, #logo und #content) zu benutzen.

Diese erhalten (gekürzt) folgende Formatierung:


body {
background-image:url(hintergrund.gif);
background-attachment:fixed;
overflow:hidden;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#nav {
position:absolute;
top:100px;
left:0px;
width:100px;
height:100%;
overflow: scroll;
}
#logo {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100px;
}
#content
{
position:absolute;
top:0px;
left:0px;
bottom:0px;
right: 0px;
margin:100px 0 0 100px;
width:auto;
height:auto;
overflow:scroll;
}
[/PHP]

Sinn dieser Formatierung ist es, bis auf den Content alles "fixed" zu haben, so dass es nicht mitscrollt und das Scrolling dem #content-Container zu überlassen. Das klappt so im Mozilla und im Opera auch sehr gut und ist CSS-Konform.

Der IE allerdings macht mir da einen Strich durch die Rechnung in der Art, dass er die Breite und Höhe des DIV-Bereichs über die Seitendimensionen hinausführt und keine Scrollbalken anbietet.

Hat irgendwer eine Idee, wie ich ihm das abgewöhnen kann?

ICQ

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...