zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Browser-Bug? Margin verschiebt äußeren Container!?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 14.09.2011, 17:09
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.09.2011
Beiträge: 1
mitch befindet sich auf einem aufstrebenden Ast
Standard Browser-Bug? Margin verschiebt äußeren Container!?

Hallo zusammen,

ich hab da einen seltsamen Fall vorliegen:

Innerhalb eines DIVs habe ich ein zweites DIV verschachtelt, in welchem ich einen Text eingebaut habe.

Nun wollte ich das innere DIV vom äußeren um hundert Pixel herabsetzen, per margin-top, was allerdings seltsamerweise dazu führt, das die Regel (margin) am äußeren DIV angewandt wird, das heißt es wandert der äußere Container um hundert Pixel runter, obwohl ich den inneren um hundert Pixel verschieben wollte.

Mir ist das ein Rätsel.

Und das komischste: wenn ich dem äußeren Container einen border gebe, (inline oder im Stylesheet macht da keinen Unterschied), dann klappt es plötzlich und der margin wird korrekt angewendet.

Ist das ein Bug? Es geschieht im Firefox sowie im Safari.

Ich poste im CSS Forum da die Symptomatik anscheinend mit CSS zu tun hat.

Weiß vielleicht jemand, was da los ist? Was mache ich falsch?

Code:
html {
    height:             100%;
}

body {
    margin:             0;
    padding:            0;
    font-size:          11px;
}

.bgWhite {
    background: #94d6f8;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#94d6f8), color-stop(20%,#ffffff));
    background: -webkit-linear-gradient(top, #94d6f8 0%,#ffffff 100%);
    background-repeat: no-repeat;
    height: auto;
}

#contentArea {
    -webkit-box-shadow:         inset 0 0 10px #888888;
    margin:                     0px auto;
    width:                      1024px;
    background-color:           #ffffff;
    -webkit-border-radius:      20px;
    margin-top:                 50px;
    display:                    block;
}
HTML-Code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>navigator v0.1beta</title>
        <link rel="stylesheet" type="text/css" href="css/main.css" />
    </head>
    <body class="bgWhite">
        <div id="contentArea">
            <div style="margin-top:100px;">
                test
            </div>
        </div>
    </body>
</html>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 14.09.2011, 18:02
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.086
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Hi,

Collapsing Margins....sind ein CSS-Prinzip und kein Bug.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 14.09.2011, 22:53
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Und noch ein Artikel zu collapsing margins.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Antwort

Stichwörter
container, div, margin, safari

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Margin auf LI verschiebt komplettes UL im Firefox Dwarf CSS 2 10.09.2007 12:31
Positionierung von Container horizontal mayhemtl CSS 9 11.08.2007 16:25
Firefox margin bug?? captain CSS 2 18.04.2007 14:39
browser verschiebt grafik um wenige pixel celine@23 CSS 4 15.01.2006 23:53


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:04 Uhr.