Announcement

Collapse
No announcement yet.

DIV verhält sich verschieden mit und ohne Border-Angabe

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • DIV verhält sich verschieden mit und ohne Border-Angabe

    Hallo!

    Ich möchte gerne ein Logo innerhalb eines div containers vertikal und
    horizontal zentrieren. Ich benutze dafür die hier beschriebene erste
    Variante:

    http://webmaster-glossar.de/css/work...kal-zentriert/

    Das funktioniert bei mir allerdings nur, wenn das Container div einen
    Rand (border:1px solid black erhält. Sobald ich die Border-Angabe
    weglasse, verschiebt sich der Div-Container. Was mache ich falsch bzw.
    kann mir jemand erklären warum das so ist?

    Ich habe das getestet mit Firefox 16.0.2 und Chromium 20.0.1132.47
    jeweils auf Ubuntu 12.04.1.

    Da sich beide Browser gleich verhalten, nehme ich mal an, dass das
    Verhalten so gewollt ist.

    Hier mein Code:

    HTML Code:
    <html>
      <body>
        <div style="width:512px;
                    height:512px;
                    border:1px solid black;
                    background:lightblue;">
    
          <img  style="display:block;
                       border:1px solid black;
                       margin: 128px auto 128px auto;"
                src="static/img/logo.png" />
        </div>
    
      </body>
    </html>
    Im Browser gerendert sieht obiger Code aus wie auf der
    linken Seite, ohne Border-Angaben siehe rechte Seite.

    seltsam.jpg

    Grüsse,
    NE

  • #2
    Moin,

    das sind "collapsing margins".

    Liebe Grüße,
    -Efchen

    Comment


    • #3
      Hallo Efchen,

      Das war ja einfach.
      vielen Dank für Deine Antwort!

      viele Grüsse, ne

      Comment

      Working...
      X