[CSS] Hintergrund unten will nicht

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [CSS] Hintergrund unten will nicht

    Hallo zusammen,

    hab hier schon paar Beiträge zu dem Thema gefunden, aber noch keine Lösung dazu

    Möchte mein 50px hohes Hintergrundbild am unteren Ende der Seite haben. Wenn die Seite zu lang ist muss man scrollen und sieht erst dann den Hintergrund. Also nicht Viewport sondern seite.

    Code:
    body { margin: 0; padding: 0; background-image: url(/pfad/di0001_bgbottom.gif); background-repeat: no-repeat; background-position: center bottom; }
    Der Hintergrund wird einfach nicht angezeigt.

    Was muss ich tun?

    VIELEN DANK!

  • #2
    html, body {
    height: 100%;
    }
    Sunshine CMS
    BannerAdManagement
    Borlabs - because we make IT easier
    Formulargenerator [color=red]Neu![/color]
    Herkunftsstatistik [color=red]Neu![/color]

    Kommentar


    • #3
      Danke für die Antwort!

      Funktioniert aber leider nur halb :-) Wenn es keine Scrollbars gibt, ist der Hintergrund am unteren Ende der Seite, das passt. Muss man aber scrollen, liegt der Hintergrund genau in der Mitte. Durch diese Angabe bezieht sich das bottom wohl auf den Viewport und nicht auf die Seite.

      Kommentar


      • #4
        Da gab es einen Trick... War das min-height?

        Kommentar


        • #5
          oder mach ihn am Bildschirmrand fest (position:fixed), dann ist es egal wie lang die Seite ist.

          Kommentar


          • #6
            min-height raffen nicht alle Browser und wenn ich position:fixed mache, bleibt der beim scrollen stehen :-) ein position: absolute; bottom: 0px; richtet das Teil am Viewport aus.... ist das ne K***

            Kommentar


            • #7
              Dann machst du halt mehrere Angaben, allá
              Code:
              html, body {
                min-height:100%;
              }
              * html, * html body {
                height:100%;
              }

              Ein netter Guide zum übersichtlichen Schreiben von PHP/MySQL-Code!

              bei Klammersetzung bevorzuge ich jedoch die JavaCoding-Standards
              Wie man Fragen richtig stellt

              Kommentar


              • #8
                Mit den verschiedenen Angaben würde zwar das Browser-Problem behoben, aber leider nicht, dass sich das 100% auf das Viewport bezieht.

                Kommentar


                • #9
                  absolutes div?

                  Kommentar


                  • #10
                    wie währe es mal mit der richtigen angabe für den BG x)

                    z.b. background-attachment:fixed;


                    www.css4you.de
                    Bitte Beachten.
                    Foren-Regeln
                    Danke

                    Kommentar


                    • #11
                      Weil dadurch das BG so groß wie der Viewport sein müsste. Aber da man vermutlich nur ein 1px hohes und vll 800px breites bild vom Browser vertikal wiederholen lassen möchte, braucht man eben background-repeat und kein fixed. Und das ganze Problem lässt sich mit height: 100% und min-height: 100% lösen. Es muss allerdings eine Browserweiche verwendet werden, weil der IE allergisch auf min-height und der FF allergisch auf das height reagiert, wenn min-height gesetzt wurde. So wars glaube ich. Und wenn nicht, es gibt zig Seiten (sogar viele meiner Seiten) nutzen das.
                      Sunshine CMS
                      BannerAdManagement
                      Borlabs - because we make IT easier
                      Formulargenerator [color=red]Neu![/color]
                      Herkunftsstatistik [color=red]Neu![/color]

                      Kommentar


                      • #12
                        Original geschrieben von Benny-one
                        Weil dadurch das BG so groß wie der Viewport sein müsste. Aber da man vermutlich nur ein 1px hohes und vll 800px breites bild vom Browser vertikal wiederholen lassen möchte, braucht man eben background-repeat und kein fixed. Und das ganze Problem lässt sich mit height: 100% und min-height: 100% lösen. Es muss allerdings eine Browserweiche verwendet werden, weil der IE allergisch auf min-height und der FF allergisch auf das height reagiert, wenn min-height gesetzt wurde. So wars glaube ich. Und wenn nicht, es gibt zig Seiten (sogar viele meiner Seiten) nutzen das.
                        Oo? hä was hat Background-repeat: repeat-y; mit Background-attachment:fixed; zutun?

                        http://ddc-forever.de/bg_div.html

                        beweist das beides geht!

                        und es geht im Opera, IE und FF

                        Und nichts mit min-height height für body ...

                        und selbst wenn ich background-repeat auf no-repeat stelle bleibt das verhalten gleich.
                        Zuletzt geändert von Wyveres; 13.11.2007, 10:30.
                        Bitte Beachten.
                        Foren-Regeln
                        Danke

                        Kommentar


                        • #13
                          okay, das ergebnis hatte ich so nicht erwartet. macht die sache ja einfacher.

                          Allerdings geht das auch nicht immer, denn ab und zu (z.B. in meinem Fall) ist der BG für den Body bereits gesetzt und ein anderer BG muss einem DIV zugeteilt werden. Dann geht das nicht mehr.
                          Sunshine CMS
                          BannerAdManagement
                          Borlabs - because we make IT easier
                          Formulargenerator [color=red]Neu![/color]
                          Herkunftsstatistik [color=red]Neu![/color]

                          Kommentar


                          • #14
                            Original geschrieben von Benny-one
                            okay, das ergebnis hatte ich so nicht erwartet. macht die sache ja einfacher.

                            Allerdings geht das auch nicht immer, denn ab und zu (z.B. in meinem Fall) ist der BG für den Body bereits gesetzt und ein anderer BG muss einem DIV zugeteilt werden. Dann geht das nicht mehr.
                            ich will dir ja nicht wiedersprechen denn auch das ist Vollkommen FALSCH x)

                            ich hab die URL oben mal um zwei DIVs erweitert x) und dem ebenfalls folgendes zugewiesen.

                            Code:
                            // mit fixed
                            .background
                            {
                            background-color:yellow;
                            background-image:url("image/ddc_small.png");
                            background-attachment: fixed;
                            background-position: right;
                            background-repeat:repeat-y;
                            height:300px;
                            width:100%;
                            border:1px solid black;
                            }
                            // ohne fixed
                            .background_2
                            {
                            background-color:yellow;
                            background-image:url("image/ddc_small.png");
                            background-position: right;
                            background-repeat:repeat-y;
                            height:300px;
                            width:100%;
                            border:1px solid black;
                            }
                            EDIT:

                            das sagt css4you dazu x)

                            Bemerkung: Der Internet Explorer bis zur Version 6 kennt background-attachment nur im <body>-Tag. Opera 6, Mozilla 1 und Netscape 7 akzeptieren es auch in anderen Elementen wie Absätzen (<p>) und <div>-Containern. Der Opera 6 fixiert Hintergrundbilder sogar in Tabellenzellen.



                            wir könnten uns jetzt streiten was gemeint ist aber grundsätzlich ... kann man Hintergrundbilder auf jedes element papen ... und sie positionieren nur halt nicht fixieren ... wenn mans geschickt anstellt. kann man dadurch schöne effekte erziehlen *g*
                            Zuletzt geändert von Wyveres; 13.11.2007, 10:14.
                            Bitte Beachten.
                            Foren-Regeln
                            Danke

                            Kommentar


                            • #15
                              Ich weiß nicht ob das Ergebnis so von der gewünscht ist. Falls ja ist es nicht das, was ich meinte.

                              Guck mal hier http://www.dsl-flieden.de/ es geht mir um den Schatten der von oben bis unten gesetzt wird. Der FF bekommt ein min-height, der IE ein height 100% da es sonst beim Scrollen zu Fehlern kommt.

                              Bastel das mit deiner Variante nach, dann glaube ich dir
                              Sunshine CMS
                              BannerAdManagement
                              Borlabs - because we make IT easier
                              Formulargenerator [color=red]Neu![/color]
                              Herkunftsstatistik [color=red]Neu![/color]

                              Kommentar

                              Lädt...
                              X