1. Weiterleitung zu NetzLiving.de
  2. Forum
    1. Unerledigte Themen
  3. zum neuen Forum
  • Anmelden
  • Suche
Dieses Thema
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Seiten
  • Forum
  • Erweiterte Suche
  1. Informatik Forum
  2. Webmaster & Internet
  3. Web-/Grafikdesign

Problem mit h1

  • Christoph R.
  • 5. Juli 2008 um 19:03
  • Unerledigt
Hallo zusammen,

das Informatik-Forum geht in den Archivmodus, genaue Informationen kann man der entsprechenden Ankündigung entnehmen. Als Dankeschön für die Treue bekommt man von uns einen Gutscheincode (informatikforum30) womit man bei netzliving.de 30% auf das erste Jahr sparen kann. (Genaue Infos sind ebenfalls in der Ankündigung)

Vielen Dank für die Treue und das Verständnis!
  • Christoph R.
    Punkte
    2.626
    Beiträge
    428
    • 5. Juli 2008 um 19:03
    • #1

    Hallo!

    Ich habe auf einer Seite eine h1-Überschrift gefolgt von normalem Text. Der Abstand zwischen der Überschrift und dem Text ist leider im Firefox und Safari anders als im IE.

    Ich habe das Problem auf folgenden Code reduziert:

    HTML
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <style>
    #page
    {
        background-color: red;
    
    
    }
    
    
    #header h1
    {
        color: White;
        font-size: 100px;
    }
        </style>
    </head>
        <body>
            <div align="center" id="page">
                <div id="header">
    
    
                    <h1>Title</h1>
    
    
            Text
    
    
                </div>
            </div>
        </body>
    </html>
    Alles anzeigen

    Ergebnis, siehe Anhang. Anscheinend verwendet der IE für den Abstand bereits die (niedrigere) Font Size des normalen Textes, während der Firefox noch die (höhere) der Überschrift verwendet.

    Ich nehme an, dass inzwischen selbst der IE den XHTML-Standard einigermaßen unterstützt und ich irgendwo einen Fehler gemacht habe.

    Kann mir ein HTML-Kundiger helfen?

  • bjelli
    Punkte
    80
    Beiträge
    15
    • 5. Juli 2008 um 22:52
    • #2

    mit firefox 3 und ie7 auf winxp kann ich das problem nicht nachvollziehen: sieht bei beiden aus wie am msie screenshot.

    Aber statt sich mit den quirks und default-formaten der verschiedenen
    browser zu ärgen würde ich ein reset-stylsheet empfehlen. das setzt
    mal einfach alles auf 0; danach kann man die abstände und größen
    bewusst so setzen wie man will.

    z.b. von eric meyer
    http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
    oder aus der yahoo interface library
    http://developer.yahoo.com/yui/reset/

  • julilla
    Punkte
    276
    Beiträge
    51
    • 6. Juli 2008 um 00:01
    • #3

    Versuch mal:

    Code
    #header h1
    {
        color: White;
        font-size: 100px;
        [B]margin: 0px;[/B]
    }

    bzw. margin händisch entsprechend setzen.

  • Christoph R.
    Punkte
    2.626
    Beiträge
    428
    • 6. Juli 2008 um 10:29
    • #4
    Zitat von bjelli

    mit firefox 3 und ie7 auf winxp kann ich das problem nicht nachvollziehen: sieht bei beiden aus wie am msie screenshot.

    Komisch, bei mir eben nicht :confused:

    Zitat von julilla

    bzw. margin händisch entsprechend setzen.

    Danke, damit hats funktioniert.

  • Pleex
    Punkte
    105
    Beiträge
    13
    • 22. Juli 2008 um 14:18
    • #5

    Du solltest bei gewissen Elementen wie Überschriften immer die Attribute, margin, padding und line-height angeben, weil diese in verschiedenen Browsern anders vordefiniert sind :)

    --Pleex

    Ps: HIER WAR EIN LINK :)

    Einmal editiert, zuletzt von enemy2k (22. Juli 2008 um 17:45) aus folgendem Grund: Link wurde entfernt. Führt zu einem online access. Spam?

  • Maximilian Rupp 27. Dezember 2024 um 00:12

    Hat das Thema aus dem Forum Grafik/Video nach Web-/Grafikdesign verschoben.

  1. Datenschutzerklärung
  2. Impressum