• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Anpassen einer Tabelle an die Browsergrösse

Spezi

New member
Hi!
ich versuche grade auf meiner Homepage ne Tabelle so zu verarbeiten, dass rechts und unten je eine Grafik ist, die sich nach rechts bzw unten immer wiederholt und sich automatisch an die Grösse des Browsers anpasst.
So ähnlich wie ist das auf www.puma.de ,da ist oben rechts dieser dicke graue Balken und nach unten die 3 grauen Linien. Die gehen immer genau bis zum Ende durch egal wie gross das Browserfenster grade ist.
Leider bin ich aus dem Quelltext nicht ganz schlau geworden. Hab schon versucht das mit der background-repeat-funktion von CSS in den entsprechenden Tabellenzellen (Layout ist mit ner Tabelle gemacht) zu machen, hat aber nicht geklappt.

Hat jemand ne Lösung für mich???

//Edit: Ich poste mal den Code der Tabelle, ist natürlich NICHT der Code der fertigen Homepage, image_01.gif ist noch Platzhalter ;)

image_02.gif und image_03.gif müssten gestrecht werden (02 rechts und 03 unten). image_o4.gif is eigentlich nur n Lückenfüller ;)


<body bgcolor=#FFFFFF leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
<table width=850 border=0 cellpadding=0 cellspacing=0>
<tr>
<td>
<img src="Bilder/image_01.gif" width=849 height=579 alt=""></td>
<td>
<img src="Bilder/image_02.gif" width=1 height=579 alt=""></td>
</tr>
<tr>
<td>
<img src="Bilder/image_03.gif" width=849 height=1 alt=""></td>
<td>
<img src="Bilder/image_04.gif" width=1 height=1 alt=""></td>
</tr>
</table>
</body>
 
Zuletzt bearbeitet:
Bei puma.de werden zwar auch Tabellen verwendet, um die Elemente zu positionieren, allerdings sind die in DIV-Tags eingebettet.

Diese DIVs werden per CSS positioniert. An den entsprechenden Stellen werden dann Grafiken, z.B. ein senkrechter Strich, eingefügt. Diese Grafiken werden innerhalb des DIV entweder auf volle Höhe oder volle Breite skaliert. Das ist der ganze Trick dabei.

Schau Dir mal im SelfHTML die Kapitel über DIVs und CSS an. Das wird dir die Gestaltung deiner Site erheblich erleichtern.
 
So hab mich mal reingelesen, Code ist nun so:

<style type="text/css">
<!--

#main {
position:absolute;
top:0px;
left:0px;
z-index:3;
}

#right {
position:absolute;
top:0px;
left:849px;
z-index:2;
}

#down {
position:absolute;
top:579px;
left:0px;
z-index:1;
height=100%;
}

-->
</style>

</head>

<body bgcolor=#545454 leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>

<div id="main">
<img src="images/image_01.gif" height=579 width=849 >
</div>

<div id="right">
<img src="images/image_02.gif" height=579 width=100%>
</div>

<div id="down">
<img src="images/image_03.gif" width=849>
</div>

</body>


Image_01 ist da wo es sein soll und wird später mit ner Tabelle ersetzt, Image_02 wiederholt grade solange nach rechts dass man nicht scrollen muss.
Problem ist Image_03, das wiederholt sich nähmlich garnicht, ausser ich schreib "height:100%" hier rein:

#down {
position:absolute;
top:579px;
left:0px;
z-index:1;
height=100%;
}

Dann wiederholt sich die Grafik aber zu oft und man kann ziemlich weit nach unten scrollen, was ja nicht Sinn der Sache ist.
 
Zurück
Oben