Im angehängten Bild ist eine potentielle HTML-Seite abgebildet, die ich mir so wie im Bild vorstelle.
Die Linkliste soll links unter dem roten Rahmen angeordnet sein und fix sein.
Das rote Hintergrundbild sollte immer zentriert sein und sich ebenfalls nicht mitverschieben.
Nur der Inhalt, der immer in den Hintergrund passen soll, soll scrollbar sein.
Beim verschieben und skalieren des Browserfensters, soll die Anordnung immer gleich bleiben:
Linkliste unter dem roten Hintergrundbild-Rahmen
Inhalt innehalb des Hintergrundbildes
Ich habe schon verschiedenes versucht mit CSS, Tabellen, etc. Immer passt
etwas nicht. Entweder ragt der Inhalt über das Hintergrundbild hinaus, oder beim Verschieben des Fensters bleibt das Fenster zentriert, der Text aber verschiebt sich. Oder es treten andere Probleme auf.
Anbei mein css-Code:
div#main {
position: absolute;
font-family:Trebuchet MS;
}
div#link {
color:#B51E23;
font-size:120%;
}
div#linklist {
font-family:Trebuchet MS ;
position:fixed;
text-align:left;
padding-top:15%;
padding-left:30%;
}
div#content {
font-family:Trebuchet MS ;
padding-top:15%;
position:absolute;
text-align:left;
}div#linklist steht für die Linkliste, die links unter dem roten Rahmen zu sehen ist
div#content steht für den Inhalt, der im Hintergrundbild eingebettet ist/sein soll.
div#main geht über den ganzen <body>-Inhalt
Bitte um konstruktive Tipps und Vorschläge. Am besten wäre Beispielcode mit dem angehängten Bild.
LG
padding-top
