elBee: Bildbreite

Hallo,

ich habe eine Tabelle in der ein Hintergrund angezeigt wird.
Dieses Hintergrundgrundbild soll NUR in der Breite 100% haben, jedoch
immer eine fixe Höhe...

Das Hintergrundbild habe ich mit einem <DIV> eingebunden:

#CSS:
div.bgskal{background-image: url("images/bg.jpg");}

#HTML:
<div class="bgskal">&nbsp;</div>

Wie kann ich jetzt sagen das dieses Hintergrundbild grundsätzlich
mit 100% BildBREITE angezeigt wird, jedoch seine Standardhöhe behält.

z.B. width=100%; height=150px

Das das Bild verzerrt ist mir bewusst...

Viele grüße
Sven Söllner

  1. Hallo,

    ich habe eine Tabelle in der ein Hintergrund angezeigt wird.
    Dieses Hintergrundgrundbild soll NUR in der Breite 100% haben, jedoch
    immer eine fixe Höhe...

    Mit dem aktuellen CSS 2.1 ist es nicht möglich, Hintergrundbilder zu skalieren.
    Was möglich ist, steht hier:
    http://de.selfhtml.org/css/eigenschaften/hintergrund.htm

    Mit CSS 3, das noch immer in Bearbeitung ist und somit frühestens
    in ein paar Jahren einsetzbar ist, wird das Skalieren/Strecken
    von Hintergrundbildern evtl. möglich sein, siehe:
    http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-background-image

    Du könntest ggf. etwas basteln mit mehreren Ebenen, die übereinander
    liegen (Stichworte: position, z-index), siehe
    http://de.selfhtml.org/css/eigenschaften/positionierung.htm

    Aber sobald position ins Spiel kommt, hast Du auch mit einigen
    Browser-Problemen zu kämpfen...

    Viel Glück!
    Thomas

    1. Hallo,

      ich habe eine Tabelle in der ein Hintergrund angezeigt wird.
      Dieses Hintergrundgrundbild soll NUR in der Breite 100% haben, jedoch
      immer eine fixe Höhe...

      Mit dem aktuellen CSS 2.1 ist es nicht möglich, Hintergrundbilder zu skalieren.
      Was möglich ist, steht hier:
      http://de.selfhtml.org/css/eigenschaften/hintergrund.htm

      Mit CSS 3, das noch immer in Bearbeitung ist und somit frühestens
      in ein paar Jahren einsetzbar ist, wird das Skalieren/Strecken
      von Hintergrundbildern evtl. möglich sein, siehe:
      http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-background-image

      Du könntest ggf. etwas basteln mit mehreren Ebenen, die übereinander
      liegen (Stichworte: position, z-index), siehe
      http://de.selfhtml.org/css/eigenschaften/positionierung.htm

      Aber sobald position ins Spiel kommt, hast Du auch mit einigen
      Browser-Problemen zu kämpfen...

      Viel Glück!
      Thomas

      OK, auf CSS3 warten dauert mir zu lange :)
      ich habe einfach ein pattern gebastelt, das sich horizontal wie auch vertikal immer gleicht... Somit fällt CSS für den Hintergrund in dieser
      Tabelle weg und ein Stand background="xxxxxxx" langt :)

      Aber trotzdem - Danke... lets W8 4 CSS3

      1. Hallo,

        OK, auf CSS3 warten dauert mir zu lange :)

        Finde ich auch ... ;-)

        ich habe einfach ein pattern gebastelt, das sich horizontal wie auch vertikal immer gleicht... Somit fällt CSS für den Hintergrund in dieser
        Tabelle weg und ein Stand background="xxxxxxx" langt :)

        Das background-Attribut solltest Du vermeiden, das ist veraltet (deprecated).
        Stattdessen kannst Du der Tabelle in HTML eine Klasse geben, z.B.
        <table class="spezialtabelle">
        und dann in CSS die Schriftfarbe, die Hintergrundfarbe und
        das Hintergrundbild für diese Tabellenklasse festlegen:
        table.spezialtabelle
         {
          color:#000000;
          background:#ffffff url(pfad/zum/hintergrundbild.gif);
         }

        Alternativ könntest Du das auch in ein style-Attribut packen, aber
        zentrale Styles sind IMHO besser und bequemer zu bewirtschaften.

        mfg Thomas