# Hintergrundbild für dynamische Tabelle und Div



## schlumsch (17. Mai 2010)

Hallo Gemeinde,

ich habe zu einem Problem schon einige Beiträge gesehen, allerdings noch keine für mich passende Lösung gefunden.
Ich bin dabei eine Page mit php und css zu gestalten. Dabei habe ich auf einer Seite eine normale Tabelle und/ oder ein
div. Darüber hinaus existiert ein Bild in beliebigem Format, etwa 100x200px (HxB).

Ziel ist es nun, dieses Bild als Hintergrund sowohl für die Tabelle, wie auch für den div zu definieren.
Das ist an sich kein Porblem, allerdings soll das Bild auftmatisch, je nach aktueller Größe von Tabelle und Div mit skaliert werden.

Die Tabelle zum Beispiel hat also keine festgelegte width und height, jedoch nur eine Spalte. 
Je nach Anzahl der Zeilen und jeweiligen Zeilenlänge soll das Bild in den Hintergrund skaliert werden. Eine Verzerrung des
Bildes ist durchaus zulässig, bzw. gar erwünscht.

Kriege ich das mit CSS irgendwie hin bzw. was bräuchte ich alternativ dafür?

Danke schon einmal, Gruß schlumsch


----------



## Maik (17. Mai 2010)

Hi,

ein Hintergrundbild lässt sich in CSS3 mittels background-size skalieren - Browserunterstützung vorausgesetzt.

mfg Maik


----------



## schlumsch (17. Mai 2010)

Hmmm,

und ohne CSS3 Gibt es da eine Möglichkeit?




> CSS 3 bringt spannende und hilfreiche Neuerungen für die Entwicklung von CSS-Layouts. Allerdings ist man von der Einführung vermutlich noch weit entfernt ....



Klingt nicht so wirklcih "toll"


----------



## Maik (17. Mai 2010)

schlumsch hat gesagt.:


> und ohne CSS3 Gibt es da eine Möglichkeit?


Nö, was das Skalieren Des Hintegrundbildes betrifft.

Ansonsten mußt mit einem Workaround vorlieb nehmen, siehe http://www.cssplay.co.uk/layouts/background.html

mfg Maik


----------



## schlumsch (17. Mai 2010)

okay, schade eigentlich. Ich dank dir


----------



## Quaese (18. Mai 2010)

Hi,

warum in die Ferne schweifen, wenn wir einen ähnlichen Workaround hier bereits an Bord haben ...

Ciao
Quaese


----------



## Maik (18. Mai 2010)

Warum? Weil ich den fast fünf Jahre alten Thread im Hinterstübchen nicht mehr präsent hatte.

mfg Maik


----------



## hela (18. Mai 2010)

Hallo,
zu dieser Technik habe ich auch noch ein Tipp:

Bestimmte Bilder können nach unten hin ohne wesentliche Probleme "unendlich" verlängert werden, z.B. dieses hier. Man schneidet sich dazu eine kleine "Rasenkachel" vom unteren Rand dieses Bildes aus und legt sie als Hintergrundbild in das BODY-Element, um sie dort in x- und y-Richtung wiederholt anzuzeigen. Im Selektor des Pseudo-Hintergrundbildes bzw. auch bei den Attributen dieses IMG-Elements (id="bgImg" in Quaeses Beitrag) wird die Höhenskalierung von 100% weggelassen. Dadurch wird das Bild bei Änderung der Fenstergröße nicht mehr verzerrt.


----------



## schlumsch (18. Mai 2010)

Ja na das Problem ist eher das die meisten meiner Tabellen / divs eine Höhe von sagen wir mal 50 - 100px haben. Die größten schätze ich mal auf 250px. Um das Hintergrundbild auch in den kleinen Bereichen anzuzeigen muss ich es also recht klein skalieren. Darüber hinaus sieht das Bild dann schei*** aus wenn ich es groß zerren würde. Ich müsste also ein mittelgroßes Bild in den Hintergrund eines Elementes legen können, so dass das Bild sowohl automatisch verkleinert, wie auch vergrößert dargestellt wird.


----------

