Seite an Browser anpassen

Status
Nicht offen für weitere Antworten.

Blumenkind

Erfahrenes Mitglied
Hi,

auf den Vorschlag von Klon mein Problem/Anliegen im Forum preiszugeben, werde ich euch mal mein Vorhaben schildern.

Also, ich möchte gerne, dass sich der Hintergrund meiner Seite, der in verschiedenen Zellen definiert ist, an die Browsergröße des Users nach unten anpasst.
Der Inhalt soll jedoch nicht verschoben werden und die Seite auch nicht verzerrt werden. Der BG soll lediglich nach unten fortlaufend fortgeführt werden (bei höheren Auflösungen jenseits der 1024*) ohne, dass dann ein Scrollbalken entsteht.

Ein gutes Beispiel dafür ist diese hier

Betrachtet die Seite mal in verschiedenen Auflösungen und ihr werdet merken, dass der Inhalt nicht verschoben wird und sich nur der untere Teil der Seite ausstreckt.

Mein bisheriger Code:

PHP:
<html>
<head>
<title></title>
</head>
<body style="background-color:#900100; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<table width="994" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="3" width="14" background="Bilder/bleft.gif">
<img src="Bilder/spacer.gif" width="14">
</td>
<td colspan="3" width="570" height="20" bgcolor="#FFFFFF">
<!-- spacer top -->
<img src="Bilder/spacer.gif" width="570" height="20">
</td>
<td rowspan="3" width="40" bgcolor="#FFFFFF">
<!-- spacer right -->
<img src="Bilder/spacer.gif" width="40">
</td>
<td rowspan="3" width="370" background="Bilder/bright.gif">
<img src="Bilder/spacer.gif" width="370">
</td>
</tr>
<tr>
<td rowspan="2" width="26" bgcolor="#FFFFFF">
<!-- spacer links -->
<img src="Bilder/spacer.gif" width="26">
</td>
<td width="246" height="27" bgcolor="#FFFFFF">
<img src="Bilder/schriftzug_top.gif" width="246" height="27">
</td>
<td height="27" width="298" bgcolor="#FFFFFF">
<!-- login -->
</td>
</tr>
<tr>
<td colspan="2" height="721" width="544" bgcolor="#FFFFFF">
<!-- content -->
</td>
</tr>
</table>
</body>
</html>

Hoffe ich habe mich verständlich ausgedrückt, falls nicht bitte nochmal nachfragen!:)

MfG BK
 
Jepp kann ich machen!

Das ist genau DIESER rot markierte Bereich.

Das problem ist wahrscheinlich, dass der markierte Bereich in verschiedene Zellen geteilt ist, wie man dem Code entnehmen kann.

Hoffe der Screenshot bringt euch weiter...

LG BK
 
ein Ansatz:
body
{
background-image: url(pfad/zum/bild.gif);
background-position: right; /* falls nur die orangenen ecken */
background-repeat: repeat-y;
}
 
nun primär würd ich mal einen Tabelle machen.
in die Tabelle fügst du in die erste Zeile deinen Inhalt.
die zweite Zelle wird nun automatisch auf die 100% Höhe aufgezogen. Mit einem align kannst du nun bestimmen wo der Untere Bereich stehen soll. so wie ich dich verstanden hab, wird es wohl das Attribut bottom sein.
Das Hintergrundbild würd ich nicht zerschnippseln, das klappt nie, vorallem nicht wenn sich vertikal das Muster ändert.

<body style="background-image:url(images/deinbild.jpg); margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<table width="100%" height="100%" border=0 cellpadding=0 cellspacing=0>
<tr>
<td height="800">INHALT</td>
</tr><tr>
<td align="bottom">DER UNTERE BEREICH</td>
</tr>
</table>
</body>
 
Wenn ich den Hintergrund nun aber als ein Bild darstelle, dann habe ich den Hinhalt und die anderen Seitenelemente nie da, wo ich sie eigentlich haben möchte?!

Habe dem Betreiber der oben genannten Seite eine Email geschickt, hoffe er meldet sich;)
 
Bisher keine Antwort des Seitenbetreibers erhalten und ich schätze mal, dass ich auch keine bekommen werden.

Ich bin nun also auf euch angewiesen und hoffe einer hat noch eine Idee zur Lösung;)

MfG BK
 
Hi Xaicon, erstmal danke für die Antwort, aber ganz so leicht ist es dann doch nicht;)

Du lässt ja nur den Hintergrund unendlich weit zeichnen, ich möchte jedoch, dass mehrere Spalten in einer Tabelle an den Browser angepasst werden.

Edit: Problem mit ein wenig herumprobieren von selbst gelöst, danke an alle Beteiligten;)

Lösung:

Tabelle in Tabelle:
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<table width="994" height="100%" border="0" cellpadding="0" cellspacing="0">

</table>
</table>
 
Zuletzt bearbeitet:
Status
Nicht offen für weitere Antworten.
Zurück