Joey: Abgerundete Ecken

Hallo,

ich bin noch recht unerfahren mit runden Ecken in HTML und wollte mal fragen wie das bei Tabellen ist. Der Internet Explorer zeigt die abgerundeten Ecken auf meiner Homepage im Gegensatz zu allen anderen Browsern mit Abständen zur restlichen Tabelle an...

Homepage ansehen

Für Tipps wäre ich sehr dankbar!

  1. Hallo Joey

    ich bin noch recht unerfahren mit runden Ecken in HTML und wollte mal fragen wie das bei Tabellen ist. Der Internet Explorer zeigt die abgerundeten Ecken auf meiner Homepage im Gegensatz zu allen anderen Browsern mit Abständen zur restlichen Tabelle an...

    Homepage ansehen

    Willst du uns verklapsen?
    Auf der verlinkten Seite gibt es keine runden Ecken, nur ein I-Frame, das http://joeywilliams.npage.de/ lädt.
    Aber auch dort gibt es keine runden Ecken, sondern nur ein 100%-Frame, welches http://joeywilliams.npage.de/home_3747039.html lädt.
    Wenn du hier Hilfe suchst, verlinke bitte die problematische Seite selbst und nicht irgendwelche Vorschalt- oder 100%-Frame-Seiten.

    So, nun zu deinem Problem:
    Entweder es sind die Unterlängen der (nichtvorhandenen) Schrift (g, q, j) in den Tabellenecken oder die Zeilenhöhe in diesen. (IE lässt für die Unterlängen Platz und nimmt als Mindesthöhe üblicherweise eine Zeilenhöhe, selbst wenn überhaupt kein Text vorhanden ist.)
    Gegen ersteres hilft es, den Grafiken display:block zu geben oder sie passend auszurichten, gegen letzteres, die Schrift und Zeilenhöhe auf ein sehr kleines Maß zu setzen.

    Grundsätzliches (Nur das, was mir auf den ersten Blick auffiel.):
    Erstmal gehört zu einem HTML-Dokument auch eine Dokumenttyp-Deklaration, damit die Browser nicht im „ich rate mal wie es gemeint sein könnte”-Modus arbeiten müssen.
    Style-Blöcke gehören in den <head>, nicht in den <body>, besser noch in eine zentrale CSS-Datei.
    Grafiken, die kein Inhalt sind, gehören nicht ins HTML sondern als Hintergrundgrafiken ins CSS.
    Tabellen fürs Seitenlayout empfehlen sich prinzipiell nicht. Ins HTML gehören nur sinnvoll ausgezeichnete Inhalte (Überschriften, Textabsätze, Listen, inhaltstragende Grafiken, Formulare usw.), alle Angaben zum Aussehen gehören ins CSS.

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
  2. Hallo,

    ich bin noch recht unerfahren mit runden Ecken in HTML und wollte mal fragen wie das bei Tabellen ist. Der Internet Explorer zeigt die abgerundeten Ecken auf meiner Homepage im Gegensatz zu allen anderen Browsern mit Abständen zur restlichen Tabelle an...

    Gegenfrage, warum machst du das so umständlich mit Tabellen, zudem noch unsymantisch? Übrigens zeigt mir mein validator zudem überall Fehler an, z.B. head-elemente, wie "title" oder "style" die im body stehen...

    Aber um dir eine antwort zu geben, wie man es besser machen kann,

    <div id="wrapper">  
    <div id="corner1" class="corner"></div>  
    <div id="corner2" class="corner"></div>  
    <div id="corner3" class="corner"></div>  
    <div id="corner4" class="corner"></div>  
    <div id="content"></div>  
    </div>
    
      
    #wrapper {position: relative;}  
    .corner {position: absolute; width: 15px; height: 15px;}  
    #corner1 {top: 0; left: 0; background: url(URL_IMGAE_OBEN_LINKS);}  
    #corner2 {top: 0; right: 0; background: url(URL_IMGAE_OBEN_RECHTS);}  
    #corner3 {bottom: 0; left: 0; background: url(URL_IMGAE_UNTEN_LINKS);}  
    #corner4 {bottom: 0; right: 0; background: url(URL_IMGAE_UNTEN_RECHTS);}  
    
    

    mfG Felix Nehrke

    P.S.: Besuche unseren Blog:  http://www.pommes-blog.de

    --
    Manchmal gibs was neues :)
    fo:| ch:| rl:( br:> n4:? ie:( va:) de:> zu:) fl:( ss:| ls:[ js:)
    1. Hallo Felix

      Aber um dir eine antwort zu geben, wie man es besser machen kann,

      <div id="wrapper">

      <div id="corner1" class="corner"></div>

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

        
      Wenn schon die Variante mit absolut positionierten Elementen, dann würde ich dafür niemals <div> verwenden. Sie erzeugen bei einer CSS-losen Darstellung unnötige leere Zeilen. Wenn, dann eher <span>, das dann im CSS auf display:block gesetzt wird.  
        
      Sinnvoller halte ich dagegen diese [Variante](http://aktuell.de.selfhtml.org/artikel/css/runde_ecken/), eventuell auch eine Kombination aus dieser und deinem Prinzip, wobei dann auch statt der vielen zusätzlichen Elemente sowieso vorhandene mit verwendet werden können. Auch [transparente Ecken](http://d-graff.de/selfhtml/rundeecken.html) oder [Ränder](http://d-graff.de/selfhtml/papier1.html) (bei Hintergrundgrafik) sind möglich.  
        
      Nicht sklavisch genau eine Version verwenden, sondern je nach Seitenstruktur und Notwendigkeit flexibel die dafür passende Variante oder Kombination wählen.  
        
        
      Auf Wiederlesen  
      Detlef  
      
      -- 
      - Wissen ist gut  
      - Können ist besser  
        
      - aber das Beste und Interessanteste ist der Weg dahin!
      
      1. Wenn schon die Variante mit absolut positionierten Elementen, dann würde ich dafür niemals <div> verwenden. Sie erzeugen bei einer CSS-losen Darstellung unnötige leere Zeilen. Wenn, dann eher <span>, das dann im CSS auf display:block gesetzt wird.

        Dir ist klar, dass du in einem span nur inline Elemente schreiben darfst?

        Es steht dir natürlich frei, einen Baum als ein Netzwerk von Sackgassen zu begreifen.

        mfg Beat

        --
        ><o(((°>           ><o(((°>
           <°)))o><                     ><o(((°>o
        Der Valigator leibt diese Fische
        1. Hallo,

          Wenn schon die Variante mit absolut positionierten Elementen, dann würde ich dafür niemals <div> verwenden. Sie erzeugen bei einer CSS-losen Darstellung unnötige leere Zeilen. Wenn, dann eher <span>, das dann im CSS auf display:block gesetzt wird.
          Dir ist klar, dass du in einem span nur inline Elemente schreiben darfst?

          und inwiefern siehst du darin ein Problem? Es geht doch hier nur darum, vier neutrale leere (und semantisch ansonsten nutzlose) Elemente zu haben, die einfach nur als Träger von Hintergrundbildern für die abgerundeten Ecken dienen.

          Es steht dir natürlich frei, einen Baum als ein Netzwerk von Sackgassen zu begreifen.

          Interessantes Konzept! :-)

          Schönen Sonntag noch,
           Martin

          --
          Die letzten Worte des Polizisten:
          Ich hab mitgezählt: Sechs Schuss, jetzt hat er keine Munition mehr!