Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 13

Thema: Footer auffüllen

  1. #1
    Azubi(ne)
    Registriert seit
    04.09.2008
    Beiträge
    70
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Frage Footer auffüllen

    Hi Leute,

    ich steh vor folgendem Problem. Ich hab einen Footer, der die ganze Seite ausfüllt. (width:100%
    Auf der linken Seite befindet sich eine PNG-Grafik. Die PNG-Grafik hat eine Stelle, an welcher sie transparent ist und das muss sie auch bleiben.

    Also folgende Ausgangslage:
    Die PNG-Grafik ist 300px breit und 80px hoch.
    Der restliche Bereich des Footers (ihr erinnert euch, dass der Footer auf 100% Breite gezogen wird) soll mit einer Farbe aufgefüllt werden.

    Das Problem wo dabei entsteht ist also, dass man nicht weiß wie groß der restliche Bereich ist. (Jeder Benutzer kann ja eine andere Auflösung verwenden)

    Hat jemand eine Idee wie ich das umsetzen kann? Wegen mir auch ein dreckiger Workaround, hauptsache es funktioniert browserunabhängig. Bei IE ab IE7+.

    Leute ich bin an verzweifeln! Danke im voraus für eure Hilfe!

    Viele Grüße
    CroWeHaMmeR
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Ungestestet, sollte aber funktionieren:
    Verwende anstelle der background-color ein background-image in Form einer kleinen, sich kachelnden Grafik, ähnlich hier.

    Positioniere diese dann mit der Eigenschaft background-position und
    Code:
    repeat: x-repeat;

  3. #3
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Footer auffüllen

    Nein, das wird so geschrieben:
    Code:
    background-repeat: repeat-x;

  4. #4
    Azubi(ne)
    Themenstarter

    Registriert seit
    04.09.2008
    Beiträge
    70
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Mann kann nicht im gleichen Zug background-position und background-repeat verwenden. Geht also nicht auf dem Weg. Andere Ideen, Lösungsvorschläge? Brauch dringend eine akzeptable Lösung

  5. #5
    Meister(in)
    Registriert seit
    24.02.2007
    Beiträge
    460
    Danke
    0
    Bekam 47 mal "Danke" in 47 Postings

    Standard AW: Footer auffüllen

    Bin mir nicht so sicher, aber es sollte so gehen.
    Code:
    background:url(bild.png) no-repeat left center #eeeeeea
    Wenn nicht, dann zeige mal eine Beispielseite.

  6. #6
    Azubi(ne)
    Themenstarter

    Registriert seit
    04.09.2008
    Beiträge
    70
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Nein, so geht es auch nicht, weil dann der gesamte Footer die Hintergrundfarbe annimmt und die transparente Stelle des PNGs verschwindet.

    Hier ein Beispiel, wie man sich das vorstellen kann, was für einen Footer ich gerne hätte. Natürlich ist mein Originalfooter grafisch etwas schöner, kann ich aber aus betriebsrelevanten Gründen nicht zeigen.
    footer_online.png

  7. #7
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Versuche mal folgendes:
    Gib dem footer (jetzt mit background-color) einen margin-left-Wert entsprechend der Grafikbreite und positioniere ihn mit position: relative.
    Innerhalb des footers füge die Grafik ein mit absoluter Positionierung zum footer, so dass die Grafik links neben dem Footer steht (im "Margin-Bereich").

  8. #8
    Azubi(ne)
    Themenstarter

    Registriert seit
    04.09.2008
    Beiträge
    70
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Kannst du mir mal den Codeschnipsel für das CSS schicken? Ich kann dir noch nicht ganze folgen. Wenn ich den footer mit margin-left um die 300px verschiebe, die von der Grafik eingenommen werden, weiß ich doch nicht wie viel Prozent es sind bis ans Ende der Seite. Vielleicht verstehe ich dich auch nicht richtig, darum die bitte um die paar Zeilen Code.

    Zur Unterstützung der bisherige Schnipsel:

    HTML-Code:
    #footer {
        width: 100%;
        height: 81px;
        position: fixed;
        left: 0;
        bottom: 0;
        margin: 0;
        background: url(footer.png) no-repeat left center #343434;
    }
    Geändert von CroweHammer (05.09.2012 um 13:55 Uhr)

  9. #9
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Kommando zurück, funktioniert so auch nicht, da dann width > 100%.

    Folgender Vorschalg:

    Code:
    #footer {
        width: 100%;
        height: 81px;
        position: fixed;
        left: 0;
        bottom: 0;
        margin: 0;
        background: #343434;
    }
    
    #footer img {
    background: transparent;
    display: block;
    height: 81px;
    width: 81px;
    }
    Code:
    <div id="footer">
    <img src="footer.png" alt="" border="0" height="81" width="81">
    </div>

  10. #10
    Azubi(ne)
    Themenstarter

    Registriert seit
    04.09.2008
    Beiträge
    70
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Footer auffüllen

    Geht auch nicht. Die transparente Stelle des PNGs wird wieder ausgefüllt

Ähnliche Themen

  1. DIV bis auf 100% zum Seitenende auffüllen
    Von Antispy im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 18.08.2012, 21:01
  2. Problem mit Footer
    Von micronix im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 01.07.2010, 12:50
  3. Hilfe - Footer weg?!
    Von klsa12 im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 12.06.2009, 11:22
  4. Footer in IE6
    Von Gast im Forum HTML & CSS Forum
    Antworten: 20
    Letzter Beitrag: 04.03.2007, 17:57
  5. Resthöhe "auffüllen"
    Von Dede4 im Forum HTML & CSS Forum
    Antworten: 9
    Letzter Beitrag: 05.11.2004, 12:24

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •