Ankündigung

Einklappen
Keine Ankündigung bisher.

Problem mit Ausrichtung

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

  • Problem mit Ausrichtung

    Ich versuche ein Hintergrundbild im <body> mit einem Zentrierten <div> in Übereinstimmung zu bringen.
    CSS:
    Code:
    body {
        margin: 0;
        background: #FFFF99 url(img/background.gif) repeat-y 50% 0;
      }
    
    div.oben {
        margin: 0;
        height: 100px;
        width: 900px;
        float: left;
        background-image: url(img/oben.jpg);
        text-align: center;
      }
    HTML-Code:
    <body>
       <div align="center">
          <div class="oben">
          </div>
       </div>
    </body>
    Im Fx funzt das auch ganz prächtig...
    Im IE ist jedoch das background-image des <div>s "oben" nicht gleich ausgerichtet, wie das background-image des <body>s. Genauer gesagt ist das <div> scheinbar um genau 1px nach links, bzw. das Hintergrundbild des <body>s um genau 1px nach rechts verschoben.

    Anzusehen auf meiner Seite!

    Ich bitte um eure Hilfe... Ich weiß nicht weiter!

  • #2
    AW: Problem mit Ausrichtung

    divs zentrierst du für gewöhnlich mit margin-left:auto und margin-right:auto vielleicht hilfts. denn kannste dir des unnütze align="center" sparen

    Gruß
    Wishu
    Der komplette Text den sie vor dieser Zeile lesen, ist per Zufall generiert worden und muss nicht zwingend Sinn ergeben.
    Wishu-Blog | Wishu.de | WishuLoad

    Kommentar


    • #3
      AW: Problem mit Ausrichtung

      Jetzt sieht der Code so aus:

      Code:
      body {
          margin: 0;
          background: #FFFF99 url(img/background.gif) repeat-y 50% 0;
        }
      
      div.oben {
          margin-right: auto;
          margin-left: auto;
          height: 100px;
          width: 900px;
          float: left;
          background-image: url(img/oben.jpg);
          text-align: center;
        }
      HTML-Code:
      <body>
            <div class="oben">
            </div>
      </body>
      HTML ist jetzt zwar übersichtlicher, nur das Problem besteht leider weiterhin...

      Kommentar


      • #4
        AW: Problem mit Ausrichtung

        ich schätze mal weil der IE nen phantombalken hat. heißt dass die breite im IE immer ein wenig kleiner ist. guck dir mal den blog an, da haste im FF auch nen scrollbalken und da ist es genau gleich ausgerichtet.

        Also is nicht dein Fehler sondern der von M$

        Gruß
        Wishu

        EDIT: Im übrigen fehlt auf deiner Seite ein Impressum.
        Der komplette Text den sie vor dieser Zeile lesen, ist per Zufall generiert worden und muss nicht zwingend Sinn ergeben.
        Wishu-Blog | Wishu.de | WishuLoad

        Kommentar


        • #5
          AW: Problem mit Ausrichtung

          Hi,
          Zitat von Antking Beitrag anzeigen
          ist das <div> scheinbar um genau 1px nach links, bzw. das Hintergrundbild des <body>s um genau 1px nach rechts verschoben.
          das ist kein Fehler, sondern Rundungsunterschied. Verkleinere im IE das Fenster etwas und die Verschiebung kommt un geht - je naxhdem ob das Fenster eine gerade oder ungerade Pixelbreite hat.

          Es ist daher nicht sinnvoll, dem body diesen Hintergund zu geben, sondern einem zentrierten um die gesamte Seite gelegtem DIV.

          Gruß
          Ingo
          Ingo Webdesign

          Kommentar


          • #6
            AW: Problem mit Ausrichtung

            Alles klar...
            Die Lösung war eigentlich 2 Lösungen...
            Zum einen habe ich ein <div> dahintergelegt und so formatiert:
            Code:
            div.background {
                width: 910px;
                margin-left: auto;
                margin-right: auto;
                background: #FFFF99 url(img/background.gif) repeat-y 50% 0;
              }
            Leider stellt Firefox diesen Hintergrund nicht dar... Deshalb auch noch zusätzlich dem <body> denselbsen background zugewiesen
            Code:
            body {
                margin: 0;
                background: #FFFF99 url(img/background.gif) repeat-y 50% 0;
              }
            Jetzt sieht man im Firefox den (dort nicht verschobenen) Background des <body>s und im IE den (dort nicht verschobenen) Background des <div>s....
            Eigentlich ein schlimmes Workaround... Aber wenn's nicht anders geht...

            Danke für die Hilfe!

            Kommentar


            • #7
              AW: Problem mit Ausrichtung

              Hi,
              Zitat von Antking Beitrag anzeigen
              Leider stellt Firefox diesen Hintergrund nicht dar...
              Firefox hält sich halt an den Standard, nach dem dieses DIV nur die Höhe hat, die sich aus dem im Fluss befinlichen Inhalten ergibt: also 0.

              Gruß
              Ingo
              Ingo Webdesign

              Kommentar


              • #8
                AW: Problem mit Ausrichtung

                Soll keine Kritik am Fx sein... Ist halt unangenehm, dass die Browser unterschiedlich darstellen.
                Kann man eigentlich unterschiedliche CSS-Datein für unterschiedliche Browser schreiben??

                Kommentar


                • #9
                  AW: Problem mit Ausrichtung

                  Hi,
                  Zitat von Antking Beitrag anzeigen
                  Kann man eigentlich unterschiedliche CSS-Datein für unterschiedliche Browser schreiben??
                  ja, aber das ist doch hier gar nicht nötig. Setze einfach ein clearendes Blockelement am Ende in das DIV, dann wird der Fluss wieder hergestellt und die Box bekommt ihre Höhe.

                  Gruß
                  Ingo
                  Ingo Webdesign

                  Kommentar


                  • #10
                    AW: Problem mit Ausrichtung

                    Oh... Was ist ein clearendes Blockelement?? Ans Ende welches <div>s soll ich "es" stellen??
                    Sorry... Aber das mit dem Objektfluss hab ich noch nie so ganz verstanden... *gg*

                    Kommentar


                    • #11
                      AW: Problem mit Ausrichtung

                      Hi,
                      schau mal hier...

                      Gruß
                      Ingo
                      Ingo Webdesign

                      Kommentar

                      homepage-forum.de - Hilfe für Webmaster! Statistiken

                      Einklappen

                      Themen: 57.196   Beiträge: 431.999   Mitglieder: 29.635   Aktive Mitglieder: 29
                      Willkommen an unser neuestes Mitglied, michael50.

                      Online-Benutzer

                      Einklappen

                      730 Benutzer sind jetzt online. Registrierte Benutzer: 3, Gäste: 727.

                      Mit 9.939 Benutzern waren am 17.05.2023 um 21:38 die meisten Benutzer gleichzeitig online.

                      Die neuesten Themen

                      Einklappen

                      Die neuesten Beiträge

                      Einklappen

                      • daniel5959
                        Antwort auf Header Problem css
                        Hallo,

                        CSS ist nicht mein Ding, das war es vor über 15 Jahren nicht und wird es auch nicht mehr werden.

                        Inzwischen nehme ich einfach ein PC-Programm, das mir den Code im Hintergrund zusammenstellt, das fertige Templates mitbringt und konzentriere mich auf den Inhalt der Seite....
                        Heute, 21:22
                      • michael50
                        Header Problem css
                        Hallo

                        Ich habe folgendes Problem ich habe einen feststehenden Header.
                        https://www.webdesignforum.com/
                        Beispiel

                        Die Schrift soll beim Scrollen verschwinden.
                        Doch wenn ich scrolle sehe ich die im Header.
                        Kann mir jemand sagen wie ich das so machen kann...
                        Gestern, 18:38
                      • Sempervivum
                        Antwort auf Header Problem css
                        Wenn dieser kopiert wird, ohne ihn zu verstehen, ist der Lerneffekt gleich Null. Besser die Grundlagen lernen und den Code selbst entwickeln.
                        Es gibt auch genügend Quellen, die die Grundlagen vermitteln und den Leser in die Lage versetzten, den Code zu verstehen. Z. B. hier für CSS:
                        htt...
                        Heute, 20:42
                      • daniel5959
                        Antwort auf Header Problem css
                        Hallo,



                        es wär schön mal einen Beispiel-Code zu präsentieren, der auch funktioniert.

                        Die ganzen schlauen Seiten der CSS-Experten, die sich bei Google finden lassen, verschweigen leider immer das Wichtigste bzw. setzen es als bekannt voraus, so dass sich deren...
                        Heute, 17:09
                      • bodan
                        Antwort auf Lassen sich mit Wärmedämmung und Wärmepumpe Kosten sparen?
                        hallo und guten Tag,



                        Arnego:

                        ich denke auch, dass man sich halt echt entscheiden muss - ob man prinzipiell eher der Aufgabe stellt - oder nicht.

                        Klar, sind auch die anderen gefragt: aber schon bei uns hier in Mitteleurpa kipppen die Wetterlagen...
                        Heute, 14:44
                      • daniel5959
                        Lassen sich mit Wärmedämmung und Wärmepumpe Kosten sparen?
                        Hallo,

                        wer hat Zahlen für die Zeit vor und nach der Fassadendämmung und / oder dem Einbau einer Wärmepumpenheizung?

                        Für mein altes Häuschen habe ich online die ungefähren Kosten einer energetischen Gebäudesanierung berechnen lassen.



                        Selbst...
                        26.05.2023, 06:06
                      • Sempervivum
                        Antwort auf Header Problem css
                        Ich verstehe das nicht ganz, mit der Schrift meinst Du doch wahrscheinlich die der übrigen Seite und die tut was Du willst, sie verschwindet beim Scrollen unter dem Header.

                        daniel5959 Ein fixed oder sticky Header gehört zu den Grundlagen und ist einfach zu realisieren. Deine Lösung, den...
                        Heute, 05:43
                      • daniel5959
                        Antwort auf Header Problem css
                        Anmerkung:

                        Mein Beitrag wurde vom Spamfilter blockiert, aber den HTML-/CSS-Code für einen fixierten Header mit farbigem Hintergrund, damit der gescrollte Text nicht im Header sichtbar wird, kann auf meiner Testseite in der Quelltextansicht angesehen und kopiert werden.

                        >>...
                        Heute, 01:41
                      • daniel5959
                        Antwort auf Header Problem css
                        Hallo,

                        eine englische Seite ohne Impressum und kein Text im Header zu sehen - Linkspammer?

                        Falls wirklich Interesse an einem fixiertem Header (Kopfbereich) mit farbigem Hintergrund besteht.

                        Ich bin kein CSS-Experte und habe mal bei Google gesucht, mir dabei viele...
                        Heute, 01:33
                      • Lupus_III
                        Antwort auf Lassen sich mit Wärmedämmung und Wärmepumpe Kosten sparen?
                        Ich habe schon viele Bäume gepflanzt. Unter einigen stelle ich im Sommer meine Sonnenliege auf. ...
                        27.05.2023, 10:16
                      Lädt...
                      X