AndreR: DIV mit pos:absolute zentrieren

Hallo,
eine ganz einfache Problemstellung kam mir vorhin auf - dachte ich jedenfalls. Mein Problem ist, dass ich ein absolut positioniertes DIV genau zentrieren möchte. Dabei ist die Breite bekannt.

Ich habe etwas bei Google gesucht und bin auf die Lösung gekommen, das zunächst mit left:50%; zu mitten und dann per Margin vollends zu zentrieren. Das klappt soweit ja auch, nur dabei tritt das Problem auf, dass dadurch ein paar Links nicht mehr klickbar sind, die eigentlich hinter der Grafik verborgen sind aber durch das Margin eben nicht mehr.

Ist es denn möglich, das Ganze wirklich ohne herumschieberei zu zentrieren? Die Größe des DIVs ist vorhersehbar.

Danke schonmal für die Hilfe!

  1. Ich habe etwas bei Google gesucht und bin auf die Lösung gekommen, das zunächst mit left:50%; zu mitten und dann per Margin vollends zu zentrieren. Das klappt soweit ja auch, nur dabei tritt das Problem auf, dass dadurch ein paar Links nicht mehr klickbar sind, die eigentlich hinter der Grafik verborgen sind aber durch das Margin eben nicht mehr.

    wenn du horizontal zentrieren möchtest, ist der wert "auto" für den linken und rechten aussenabstand genau das richtige für dich, position absolute ist fehl am platz

    Ist es denn möglich, das Ganze wirklich ohne herumschieberei zu zentrieren? Die Größe des DIVs ist vorhersehbar.

    wenn du vertikal UND horizontal zentrieren möchtest, hilft dir ggf. das hier weiter:
    http://suit.rebell.at/index.php?id=14
    user: suit
    pass: rebell

    1. wenn du horizontal zentrieren möchtest, ist der wert "auto" für den linken und rechten aussenabstand genau das richtige für dich, position absolute ist fehl am platz

      Nein, ich muss den absolut positionieren, da er einen anderen DIV zwingend überlappen muss.

      1. Nein, ich muss den absolut positionieren, da er einen anderen DIV zwingend überlappen muss.

        dann ist das element ohnehin aus dem textfluss genommen - wo liegt also das problem bei 4 (!) zeilen css?

        1. Nein, ich muss den absolut positionieren, da er einen anderen DIV zwingend überlappen muss.
          dann ist das element ohnehin aus dem textfluss genommen - wo liegt also das problem bei 4 (!) zeilen css?

          Wie gesagt, es funktioniert so eben nicht. Entweder es landet nah rechts verschoben oder ich verschiebe es manuell nach links, dass ist aber der Bereich rechts neben dem Bild nicht mehr markierbar (da der unsichtbare Teil des DIVs den Bereich verdeckt).

          Ich hätte eben gerne, dass das Teil wirklich nur seine 150 Pixel breite hat und nicht zwecks dem Margin 225.

          1. Hi,

            Wie gesagt, es funktioniert so eben nicht.

            Lies das, zack-zack!

            Entweder es landet nah rechts verschoben oder ich verschiebe es manuell nach links, dass ist aber der Bereich rechts neben dem Bild nicht mehr markierbar (da der unsichtbare Teil des DIVs den Bereich verdeckt).

            Ich hätte eben gerne, dass das Teil wirklich nur seine 150 Pixel breite hat und nicht zwecks dem Margin 225.

            margin gibt nur einen Aussenabstand an, vergroessert das Element aber nicht. Irgendwas machst du also falsch.

            MfG ChrisB

            --
            „This is the author's opinion, not necessarily that of Starbucks.“
            1. margin gibt nur einen Aussenabstand an, vergroessert das Element aber nicht. Irgendwas machst du also falsch.

              Nun ja, in gewisser weise schon. Wenn ich ein Div mit sagen wir 200 Pixel Breite zentriere, also es um 50% verschiebe, habe ich von der Mitte an 200 Pixel nach rechts. Um das Div nun zu zentrieren, stelle ich das Margin auf -100. Nun wird aber im Mozilla trotzdem der 100 Pixel breite Bereich rechts neben dem Inhalt überblendet. Opera macht das nicht.

              Jedenfalls habe ich in dem Div ein Bild liegen, das zwar perfekt mittig sitzt, aber dem Text hinter dem verborgenen 100px-Bereich kann ich nicht markieren oder anklicken oder sonstwas.

              1. Nun ja, in gewisser weise schon. Wenn ich ein Div mit sagen wir 200 Pixel Breite zentriere, also es um 50% verschiebe, habe ich von der Mitte an 200 Pixel nach rechts. Um das Div nun zu zentrieren, stelle ich das Margin auf -100. Nun wird aber im Mozilla trotzdem der 100 Pixel breite Bereich rechts neben dem Inhalt überblendet. Opera macht das nicht.

                kann man das irgendwie sehen, ich kann mir nichts darutner vorstellen

                1. kann man das irgendwie sehen, ich kann mir nichts darutner vorstellen

                  Hat sich erledigt, ich habe etwas falsch gemacht.

                  1. Hat sich erledigt, ich habe etwas falsch gemacht.

                    verrätst du uns auch, was das war?

                    wenn jemand diesen, dann archivierten thread, in 6 monaten findet, weil er das selbe oder ein ähnliches problem hat, will er vermutlich nicht dumm sterben :)

              2. Hallo Andre

                Um das Div nun zu zentrieren, stelle ich das Margin auf -100.

                Gibst du dem Div selbst margin-left:-100px; oder etwa seinem Inhalt?

                Nun wird aber im Mozilla trotzdem der 100 Pixel breite Bereich rechts neben dem Inhalt überblendet.

                Zeige uns bitte eine Seite wo das passiert. Ich habe genau das jetzt extra getestet, ein Div mit den genannten CSS-Eigenschaften. Alle Links, auch direkt rechts neben dem Div, selbst die, die zum größten Teil überdeckt werden, funktionieren bei mir im Mozilla einwandfrei.

                Jedenfalls habe ich in dem Div ein Bild liegen, …

                Nur ein Bild, oder noch mehr?
                Wenn das Div nur ein Bild enthält, kannst du das Div weglassen und dem Bild selbst die CSS-Eigenschaften zuweisen.

                Auf Wiederlesen
                Detlef

                --
                - Wissen ist gut
                - Können ist besser
                - aber das Beste und Interessanteste ist der Weg dahin!
  2. Hi,

    Ich habe etwas bei Google gesucht und bin auf die Lösung gekommen, das zunächst mit left:50%; zu mitten und dann per Margin vollends zu zentrieren. Das klappt soweit ja auch, nur dabei tritt das Problem auf, dass dadurch ein paar Links nicht mehr klickbar sind, die eigentlich hinter der Grafik verborgen sind aber durch das Margin eben nicht mehr.

    welche "die" Grafik? Welche Links? Wo soll etwas nicht klickbar sein?

    Dein Problem ist nicht reproduzierbar. Ergo ist es nicht lösbar. Wenn Du willst, dass wir Dir helfen, dann beschreibe Dein Problem so, dass wir es reproduzieren können. Hierbei ist in den meisten Fällen ein Link auf den minimierten(!) Problemfall *äußerst* hilfreich.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes