WernerK: Browser Standard Padding?

Hallo,
ich habe in einem Content Bereich einen Hintergrund angegeben.

<div id="content">
.........
</div>

Jetzt ist aber ganz oben und links ein weisser Abstand zu sehen.
Ist das eine Art "Default Padding" von den Browsern?

Wenn ich folgendes einbaue:

  
* {  
  margin: 0;  
  padding: 0;  
}  

Ist der Rand oben und links weg.
Ich denke diese Angabe wirkt sich aber auch auf weitere Margin und Padding Angaben aus oder?
Oder ist das Ok so?

Gruss
Werner

  1. Hallo

    Jetzt ist aber ganz oben und links ein weisser Abstand zu sehen.
    Ist das eine Art "Default Padding" von den Browsern?

    Ja, es ist das Standard-Padding (und/oder auch -Margin) der Browser.

    Wenn ich folgendes einbaue:

    • {
        margin: 0;
        padding: 0;
      }
    
    >   
    > Ist der Rand oben und links weg.  
    > Ich denke diese Angabe wirkt sich aber auch auf weitere Margin und Padding Angaben aus oder?  
      
    Ja. Der Asterisk (\*) ist der Generalselektor, der \*alles\* mitnimmt. Wenn es dir nur um den Margin/Padding des Dokuments zum Browserfensterrand geht, selektiere mit html und body. Ansonsten musst du nämlich für \*alle anderen\* Elemente die Margins und Paddings wieder hinzufügen.  
      
    Tschö, Auge  
    
    -- 
    Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.  
    Terry Pratchett, "Wachen! Wachen!"  
      
    ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:} 
    
    1. Hallo

      Ja. Der Asterisk (*) ist der Generalselektor, der *alles* mitnimmt. Wenn es dir nur um den Margin/Padding des Dokuments zum Browserfensterrand geht, selektiere mit html und body. Ansonsten musst du nämlich für *alle anderen* Elemente die Margins und Paddings wieder hinzufügen.

      hmm,
      habe das mal jetzt so versucht:

        
      html>body {  
      margin: 0;  
      padding: 0;  
      }  
      
      

      aber es scheint das nun nur der linke Rand entfernt wird. Oben ist immer noch ein Rand

      Gruss
      Werner

      1. Hallo

        Wenn es dir nur um den Margin/Padding des Dokuments zum Browserfensterrand geht, selektiere mit html und body.

        habe das mal jetzt so versucht:

        html>body {
        margin: 0;
        padding: 0;
        }

          
        Du selektierst alle `body`{:.language-html}, die direktes Kind von `html`{:.language-html} sind. Das ist unnötig spezifisch, denn `body`{:.language-html} ist in einem validen HTML-Dokument immer ein direktes Kind von `html`{:.language-html}, und speziell hier auch am Problem vorbei. Du willst die Abstände von `html`{:.language-html} und von `body`{:.language-html} auf 0 setzen.  
          
        ~~~css
        html, body {  
        margin: 0;  
        padding: 0;  
        }
        

        Tschö, Auge

        --
        Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
        Terry Pratchett, "Wachen! Wachen!"
        ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
        1. Hallo,

          html, body {

          margin: 0;
          padding: 0;
          }

            
          Leider ist es auch mit dieser Notierung so das der obere Rand noch da ist. Links ist er weg.  
            
          Gruss  
          Werner
          
          1. Hallo

            html, body {

            margin: 0;
            padding: 0;
            }

            
            >   
            > Leider ist es auch mit dieser Notierung so das der obere Rand noch da ist. Links ist er weg.  
              
            Hmm, ich wage einen Schuss in's Blaue und vermute, dass das die Auswirkung des Randes eines anderen Elements ist.  
              
            Tschö, Auge  
            
            -- 
            Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.  
            Terry Pratchett, "Wachen! Wachen!"  
              
            ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:} 
            
            1. Hallo,

              Leider ist es auch mit dieser Notierung so das der obere Rand noch da ist. Links ist er weg.

              Hmm, ich wage einen Schuss in's Blaue und vermute, dass das die Auswirkung des Randes eines anderen Elements ist.

              Vielleicht ist der Rand ja auf dem Bild...

              Gruß
              Kalk

  2. Hi,

    Ist das eine Art "Default Padding" von den Browsern?

    ja, die meisten Browser sehen für body ein wenig padding im Browser-Stylesheet vor.
    Kannst du mit Firebug leicht überprüfen - der sagt dir nicht nur, welche Werte an welcher Stelle wirksam sind, sondern auch, wo sie herkommen.

    Ciao,
     Martin

    --
    Dürfen Finanzbeamte eigentlich ihren Kaffee schwarz trinken? - Ich glaube ja. Aber sie dürfen ihre Tasse nicht absetzen.
      (gehört auf SWR3)
    Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    1. Hallo,

      Kannst du mit Firebug leicht überprüfen - der sagt dir nicht nur, welche Werte an welcher Stelle wirksam sind, sondern auch, wo sie herkommen.

      Ich habe das gerade mal versucht.
      Kannst du mir mal bitte sagen wie das geht?
      Ich kann doch im Firebug im Reiter CSS immer nur die jeweiligen CSS Dateien anschauen. Wo findet man denn den Default Margin?

      Gruss
      Werner

      1. Hallo

        Kannst du mit Firebug leicht überprüfen - der sagt dir nicht nur, welche Werte an welcher Stelle wirksam sind, sondern auch, wo sie herkommen.

        Ich kann doch im Firebug im Reiter CSS immer nur die jeweiligen CSS Dateien anschauen. Wo findet man denn den Default Margin?

        Einerseits gibt dir der Reiter HTML für ein angeklicktes/aktiviertes Element rechts daneben die vorhandenen CSS_Regeln an und zweitens gibt dir der Reiter Layout alle Angaben zu den Dimensionen des aktivierten Elements.

        Tschö, Auge

        --
        Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
        Terry Pratchett, "Wachen! Wachen!"
        ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
  3. Jetzt ist aber ganz oben und links ein weisser Abstand zu sehen.
    Ist das eine Art "Default Padding" von den Browsern?

    Viellecht möchtest Du etwas wie normalize.css einsetzen, um eine einheitliche Ausgangsbasis zu bekommen (gibt's auch per CDN).

  4. @@WernerK:

    nuqneH

    • {
        margin: 0;
        padding: 0;
      }
    
    >   
    > Ist der Rand oben und links weg.  
    > Ich denke diese Angabe wirkt sich aber auch auf weitere Margin und Padding Angaben aus oder?  
      
    Ja, das tut sie.  
      
    
    > Oder ist das Ok so?  
      
    [Nein, eher nicht.](https://forum.selfhtml.org/?t=219451&m=1515733)  
      
    Qapla'
    
    -- 
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)