novice: schrift-größe wird nicht umgesetzt?

Hallo Zusammen.

Ich habe eine Frage zu meiner styles.css.

Ich habe für die Seitennavigation einen "top"-Querverweis angesetzt. Über die styles.css erfolt die Formatierung. Allerdings wird die Schriftgröße und Texthöhe nicht entprechend umgesetzt. Woran kann es liegen? Alle anderen formatierungen nimmt er an, d.h. der Zugriff passt eigentlich (habe ich über align=left/right/center getestet; meine css habe ich unten angehängt)

Ach so, noch eins.
Gibt es eine Möglichkeit mit ccs die Internetseite für "sämtliche" Browser zu optimeren?

es wäre schön, wenn mir jemand weiterhelfen könnte?

Danke im Vorraus, Novice

_______________________
styles.css

body  {background: #EDF2FF;
       font-family: "Sans Serif", "Trebuchet MS", Arial, Helvetica, san-serif;
       color: #4D65A0}
h1,h2 {margin:0}
h2    {border-top:2px solid #4D65A0; padding-top:10px}
p     {margin-top:12px; margin-bottom:12px;
       font-size:11pt;
       line-height:1.35;
       color: #4D65A0;
       font-family: "Sans Serif", "Trebuchet MS", Arial, Helvetica, san-serif;
       }
p.top {font-size: 8pt;
      line-height:0.75;
      text-align:right;
      color: #4D65A0;
      font-family: "Sans Serif", "Trebuchet MS", Arial, Helvetica, san-serif;
      }

  1. @@novice:

    Allerdings wird die Schriftgröße und Texthöhe nicht entprechend umgesetzt. Woran kann es liegen?

    Das lässt sich natürlich ohne Kenntnis deines HTML-Quelltextes nicht sagen.

    p.top {font-size: 8pt;

    pt ist eine denkbar ungeeignete Einheit für die Angabe der Schriftgröße bei Bildschirmausgabe. Verwende relative Einhaiten (em)!

    font-family: "Sans Serif", "Trebuchet MS", Arial, Helvetica, san-serif;

    Typo: Es muss "sans-serif" heißen. (Tritt mehrmals auf.)

    Live long and prosper,
    Gunnar

    --
    „Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)
    1. Das lässt sich natürlich ohne Kenntnis deines HTML-Quelltextes nicht sagen.

      Hier isser: (nur ein Auszug bis zum ersten top, Seite ist noch nicht online, daher muss ich ihn so anhängen)

      <html>
      <head>
      <title> X</title>
      <link rel="stylesheet" type="text/css" href="styles.css"/ media="screen">
      <link rel="stylesheet" type="text/css" href="print.css"/ media="print">

      <a name="top"></a>
      <H1 align="center">Glossar K&uuml;stenschutz</H1>
      <P align=justify>

      <BR>
      <CENTER><a href="#glossar a">A</a> <a href="#glossar b">B</a> <!a href="#glossar c">C</a> <a href="#glossar d">D</a> <a href="#glossar e">E</a>
      <a href="#glossar f">F</a> <a href="#glossar g">G</a> <!a href="#glossar h">H</a> <!a href="#glossar i">I</a> <!a href="#glossar j">J</a> <a href="#glossar k">K</a>
      <a href="#glossar l">L</a> <a href="#glossar m">M</a> <a href="#glossar n">N</a> <!a href="#glossar o">O</a> <a href="#glossar p">P</a> <!a href="#glossar q">Q</a>
      <a href="#glossar r">R</a> <a href="#glossar s">S</a> <a href="#glossar t">T</a> <a href="#glossar u">U</a> <a href="#glossar v">V</a>
      <a href="#glossar w">W</a> <!a href="#glossar x">X</a> <!a href="#glossar y">Y</a> <!a href="#glossar z">Z</a> </CENTER>
      <BR><BR>

      <a name="glossar a"><H3 align=CENTER><!FONT FACE="Comic Sans MS">A</FONT></H3></a>
      <FONT><b>Abbruchkante</b></FONT><BR>
      Die Abbruchkante ist eine steile, durch einen Landabbruch entstandene, stufenartige Uferkante der Marschk&uuml;ste am Vorland von etwa
      0,20 m bis 1,00 m H&ouml;he infolge Wellenschlags und Gezeitenstr&ouml;mungen w&auml;hrend der Tidehochwasser, sowie vereinzelt durch
      Eisschollen im Winter hervorgerufen. An der Geestk&uuml;ste (sandige K&uuml;ste) entstehen infolge Sturmfluten bis zu etwa 20 m H&ouml;he
      Abbruchkanten an den Randd&uuml;nen, ebenso am Kliff .<BR><BR>

      <a name="glossar b"><H3 align=CENTER><FONT FACE="Comic Sans MS">B</FONT></H3></a>
      <FONT><b>Begr&uuml;ppung, Begr&uuml;ppelung, Schl&ouml;tung</b></FONT><BR>
      Herstellen eines Grabensystems in Lahnungsfeldern f&uuml;r das verlangsamte und verteilte Ein- und Ausflie&szlig;en des Tidewassers
      zur F&ouml;rderung der Aufschlickung und des Anwachses am Seedeichfu&szlig;. Auf hohen Gr&uuml;nlandfl&auml;chen des Vorlandes wird mit
      kleineren Querschnittsabmessungen der Gr&uuml;ppen eine so genannte Bedarfsbegr&uuml;ppung zur Entw&auml;sserung durchgef&uuml;hrt.
      Die Gr&auml;ben (Gr&uuml;ppen) werden nach Aufschlickung etwa j&auml;hrlich neu ausgehoben. Der Boden wird auf die dazwischenliegenden
      Beete geworfen, wodurch die Landbildung zus&auml;tzlich gef&ouml;rdert wird. In Ostfriesland wird das Herstellen
      dieser Gr&auml;ben mit „schl&ouml;ten“, in Schleswig-Holstein mit „begr&uuml;ppen“ oder „begr&uuml;ppeln“ bezeichnet.<BR><BR>
      <FONT><b>Bemessungswasserstand</b></FONT><BR>
      Die Sturmflutkatastrophe 1953 in den Niederlanden gab erstmalig Anlass zur Untersuchung des h&ouml;chsten zu erwartenden Sturmtidewasserstandes.
      Dieser "ma&szlig;gebende Sturmflutwasserstand", der sp&auml;ter als "Bemessungswasserstand" bezeichnet worden ist, wurde empirisch festgelegt.
      In der weiteren Entwicklung entstand daraus ein Verfahren zur Bestimmung der Deichh&ouml;hen in Schleswig-Holstein, das von einem ma&szlig;gebenden
      Sturmtidewasserstand ausgeht, der statistisch in 100 Jahren einmal erreicht oder &uuml;berschritten wird.<BR><BR>
      <a name="glossar buhne"><FONT><b>Buhne</b></FONT></a><BR>
      Senkrecht zum Ufer in ein Gew&auml;sser vorgebautes Uferschutzwerk aus Busch, Holz, Stein, Stahlbeton oder Asphalt.
      Buhnen haben den Zweck, die Str&ouml;mung des Wassers vom Ufer abzuweisen, auf die Wasserbewegung beruhigend zu
      wirken und das Absetzen der im Wasser befindlichen Feststoffe (Schlick, Sand) zu f&ouml;rdern. Das in das Ufer eingebundene
      landseitige Ende der Buhne hei&szlig;t Buhnenwurzel, der wasserseitige vordere Teil Buhnenkopf. Zwischen zwei benachbarten Buhnen
      liegende Strand- oder Wattfl&auml;chen werden Buhnenfelder genannt.<BR><BR>
      <FONT><b>Buschlahnung</b></FONT><BR>
      Mit Buschwerk (-faschinen) gef&uuml;llte Lahnung.<BR><BR>

      <p class="top"><a href="#top">top</a></p>

      ...

      </BODY>
      </HTML>

      1. Hier isser: (nur ein Auszug bis zum ersten top, Seite ist noch nicht online, daher muss ich ihn so anhängen)

        ach gott - das erste was mir in den kopf schiesst: "ich soll keine html entities verwenden" eine vernünftige zeichencodierung ist wesentlich sinnvoller

        <link rel="stylesheet" type="text/css" href="styles.css"/ media="screen">
        <link rel="stylesheet" type="text/css" href="print.css"/ media="print">

        ungeachter der augenscheinlich anderen fehler die du gemacht hast (der da viele sind) dürften folgende beiden zeilen schukl sein - dieser einsame slash nach dem href-attribut ist sicher nicht förderlich für die korrekte einbindung - alternativ könnte natürlich auch einer der anderen fehler verantwortlich sein

        1. @@suit:

          ach gott - das erste was mir in den kopf schiesst: "ich soll keine html entities verwenden" eine vernünftige zeichencodierung ist wesentlich sinnvoller

          Ja, und das gibt’s jetzt auch endlich auf Deutsch zu lesen. :-)

          Live long and prosper,
          Gunnar

          --
          „Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)
      2. Tach,

        Hier isser: (nur ein Auszug bis zum ersten top, Seite ist noch nicht online, daher muss ich ihn so anhängen)

        oha, darf ich dich als Vertreter der Webentwickler-Gemeinde im 21. Jahrhundert willkommen heißen?
        Dein Quelltext ist leider grob fehlerhaft (was machen da die Ausrufezeichen in den Tags?) bzw. stark veraltet (z.B. Verwendung von font und center; das ganze wirkt wie ein Flashback in die 90er-Jahre.

        Trotz allem stellt mein Firefox, die von dir gewünschte Schriftgröße ein, wenn ich dein Beispiel teste, aber bei nicht standardkonformen Seiten ist das eher Zufall als zu erwarten.

        Zu empfehlen wäre eine Neu-Umsetzung der Seiten, das könnte dann im HTML etwa so aussehen:

          
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
          
        <html xmlns="http://www.w3.org/1999/xhtml">  
          <head>  
            <title>X</title>  
            <link rel="stylesheet" type="text/css" href="styles.css" media="screen">  
          </head>  
          <body>  
            <h1>Glossar Küstenschutz</h1>  
            <ol id="Anfangsbuchstaben">  
              <li><a href="#a">A</a></li>  
              <li><a href="#b">B</a></li>  
              <li>C</li>  
            </ol>  
            <dl>  
              <dt><a href="#Anfangsbuchstaben">top</a><h2 id="a">A</h2></dt>  
              <dd>  
                <dl>  
                  <dt>Abbruchkante</dt>  
                  <dd>Die Abbruchkante ist eine steile, durch einen Landabbruch entstandene, stufenartige Uferkante der Marschküste am Vorland von etwa 0,20 m bis 1,00 m Höhe infolge Wellenschlags und Gezeitenströmungen während der Tidehochwasser, sowie vereinzelt durch Eisschollen im Winter hervorgerufen. An der Geestküste (sandige Küste) entstehen infolge Sturmfluten bis zu etwa 20 m Höhe Abbruchkanten an den Randdünen, ebenso am Kliff .</dd>  
                </dl>  
              </dd>  
              <dt><a href="#Anfangsbuchstaben">top</a><h2 id="b">B</h2></dt>  
              <dd>  
                <dl>  
                  <dt>Begrüppung, Begrüppelung, Schlötung</dt>  
                  <dd>Herstellen eines Grabensystems in Lahnungsfeldern für das verlangsamte und verteilte Ein- und Ausfließen des Tidewassers zur Förderung der Aufschlickung und des Anwachses am Seedeichfuß. Auf hohen Grünlandflächen des Vorlandes wird mit kleineren Querschnittsabmessungen der Grüppen eine so genannte Bedarfsbegrüppung zur Entwässerung durchgeführt. Die Gräben (Grüppen) werden nach Aufschlickung etwa jährlich neu ausgehoben. Der Boden wird auf die dazwischenliegenden Beete geworfen, wodurch die Landbildung zusätzlich gefördert wird. In Ostfriesland wird das Herstellen dieser Gräben mit „schlöten“, in Schleswig-Holstein mit „begrüppen“ oder „begrüppeln“ bezeichnet.</dd>  
                  <dt>Bemessungswasserstand</dt>  
                  <dd>Die Sturmflutkatastrophe 1953 in den Niederlanden gab erstmalig Anlass zur Untersuchung des höchsten zu erwartenden Sturmtidewasserstandes. Dieser "maßgebende Sturmflutwasserstand", der später als "Bemessungswasserstand" bezeichnet worden ist, wurde empirisch festgelegt. In der weiteren Entwicklung entstand daraus ein Verfahren zur Bestimmung der Deichhöhen in Schleswig-Holstein, das von einem maßgebenden Sturmtidewasserstand ausgeht, der statistisch in 100 Jahren einmal erreicht oder überschritten wird.</dd>  
                </dl>  
              </dd>  
            </dl>  
          </body>  
        </html>  
        
        

        und das dazu passende CSS:

          
        body {  
          background-color:#EDF2FF;  
          color:#4D65A0;  
          font-family:"Sans Serif","Trebuchet MS",Arial,Helvetica,sans-serif;  
        }  
        h1, h2 {  
          margin:0pt;  
        }  
          
        dt {  
          border-top:2px solid #4D65A0;  
          padding:10px;  
        }  
          
        ol{  
          list-style-type:none;  
        }  
          
        li{  
          display:inline;  
        }  
          
        dd dt, dd dd{  
          border:none;  
          padding:5px;  
        }  
          
        dt a{  
          float:right;  
          width:10em;  
        }  
          
        dd dt{  
          font-weight:bold;  
        }  
        
        

        mfg
        Woodfighter

        1. Zu empfehlen wäre eine Neu-Umsetzung der Seiten, das könnte dann im HTML etwa so aussehen:

          die verschachtelten defintionslisten sind etwas uncool - warum einen h2 in einen dt sperren und eine weitere definitionsliste in enien dd?

          zudem darf ein h2 afaik garnicht in einem dt stehen, der darf doch nur inline-elemente beinhalten?

          1. Tach,

            die verschachtelten defintionslisten sind etwas uncool - warum einen h2 in einen dt sperren und eine weitere definitionsliste in enien dd?

            Weil damit meiner Meinung nach der Zusammenhang zwischen dem Anfangsbuchstaben und der dazugehörigen Begriffe deutlicher wird. Außerdem stellt ein solches Glossar meiner Meinung nach nunmal eine Liste von Anfangsbuchstaben dar, die jeweils eine Liste von Begriffen enthalten. Man könnte die äußere Liste prinzipiell auch als ul auszeichnen und die Buchstaben dann per CSS ausgeben (list-style-type:upper-alpha), halte ich aber für unschön.

            zudem darf ein h2 afaik garnicht in einem dt stehen, der darf doch nur inline-elemente beinhalten?

            Das ist richtig, und ich werde es mir nie merken können, dt darf nur inline enthalten dd wiederum alles.

            mfg
            Woodfighter

            1. Weil damit meiner Meinung nach der Zusammenhang zwischen dem Anfangsbuchstaben und der dazugehörigen Begriffe deutlicher wird. Außerdem stellt ein solches Glossar meiner Meinung nach nunmal eine Liste von Anfangsbuchstaben dar, die jeweils eine Liste von Begriffen enthalten. Man könnte die äußere Liste prinzipiell auch als ul auszeichnen und die Buchstaben dann per CSS ausgeben (list-style-type:upper-alpha), halte ich aber für unschön.

              deine meinung ist aber ggf. nicht ganz richtig ;) aber auf was, ausser den nachfolgenden text bezieht sich eine überschrift sonst?

              bez der liste an begriffen, damit hast du auch wieder recht, aber die buchstaben zwischen drinnen würde ich schon als überschriften interpretieren

              1. Tach,

                deine meinung ist aber ggf. nicht ganz richtig ;)

                da dieser Fall in den vergangenen bald 27 Jahren meiner Existenz noch nicht vorgekommen ist, muß ich dir schwer widersprechen ;-)

                aber auf was, ausser den nachfolgenden text bezieht sich eine überschrift sonst?

                Ähm, äh, "Kann denn nicht ein einziges Mal jemand an die Kinder denken?"; hmm nagut überführt

                bez der liste an begriffen, damit hast du auch wieder recht, aber die buchstaben zwischen drinnen würde ich schon als überschriften interpretieren

                Ach, das wäre ja viel zu einfach.

                mfg
                Woodfighter

            2. @@Jens Holzkämper:

              Man könnte die äußere Liste prinzipiell auch als ul auszeichnen und die Buchstaben dann per CSS ausgeben (list-style-type:upper-alpha), halte ich aber für unschön.

              Gelinde gesagt. Ich halte es für falsch.

              Die Buchstaben gehören zum Inhalt, nicht zur Darstellung. Die Seite soll ja auch ohne Stylesheet verständlich sein.

              Live long and prosper,
              Gunnar

              --
              „Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)
              1. Tach,

                @@Jens Holzkämper:

                zu viel auf Boards unterwegs gewesen?

                Man könnte die äußere Liste prinzipiell auch als ul auszeichnen und die Buchstaben dann per CSS ausgeben (list-style-type:upper-alpha), halte ich aber für unschön.

                Gelinde gesagt. Ich halte es für falsch.

                Die Buchstaben gehören zum Inhalt, nicht zur Darstellung. Die Seite soll ja auch ohne Stylesheet verständlich sein.

                Das bleibt sie ja, nur das üblicherweise verwandte Standardstylesheet, dass geordnete Listen nummeriert darstellt, ist halt unschön. Ohne Nummern wäre es ja nicht unverständlich, es bleibt ja weiterhin eine Liste von nach Anfangsbuchstaben sortierten Begriffen.

                mfg
                Woodfighter

                1. @@Jens Holzkämper:

                  @@Jens Holzkämper:

                  zu viel auf Boards unterwegs gewesen?

                  Nö, nützliches Feature in der Suchfunktion vermisst: Suche in Postings, die Autor X als Antwort auf ein Posting von Y verfasst hat.

                  Zumindest für X = ich kann lässt sich das jetzt realisieren: '+author:Gunnar +author:Bittersmann +"@@Gunnar Bittersmann"' findet alle Gunnar™-Postings.

                  Ich hatte das letztens erst erklärt, konnte das Posting aber nicht mehr wiederfinden. War wohl in einem deprecated thread.

                  Die Buchstaben gehören zum Inhalt, nicht zur Darstellung. Die Seite soll ja auch ohne Stylesheet verständlich sein.

                  Das bleibt sie ja, nur das üblicherweise verwandte Standardstylesheet, dass geordnete Listen nummeriert darstellt, ist halt unschön. Ohne Nummern wäre es ja nicht unverständlich, es bleibt ja weiterhin eine Liste von nach Anfangsbuchstaben sortierten Begriffen.

                  Aber ohne eben diese Anfangsbuchstaben.

                  Wenn schon als Liste ausgezeichnet, dann würde ich in _diesem Fall_ das <http://de.selfhtml.org/html/text/listen.htm#html_eigenschaften@title=HTML-Attribut 'type'> der CSS-Eigenschaft 'list-style-type' vorziehen.

                  Live long and prosper,
                  Gunnar

                  --
                  „Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)