Roberta: Die Firefox-Verzweiflung

Hallo,
ich habe ein, für mich, unlösbares Problem. Firefox interpretiert meine Internet Seite nicht so wie ich es gerne hätte:

1)  Die Tabellen werden nicht nebeneinander angezeigt (habe es schon mit div probiert, scheint aber nicht zu funktionieren)

  1. Die beiden Tabellen sollen so stehen:

xxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxx
xxx
xxx
xxx
xxx
xxx
xxx

Der Hintergrund ergibt so im IE ein Bild, bei Firefox aber nicht.

Die Internetseite:
http://www.barbarahuebner.de

Der Code für die Tabellen:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
 <title>Galerie</title>

</head>

<body bgcolor="#99cc66" text="#FFFFFF" link="#OOOOOO" vlink="#OOOOOO" alink="#OOOOOO">
<font face="Century Gothic">
<table width="100%" height="25%" border="2" cellspacing="0" cellpadding="0" align="right" bordercolor="#000000" background="images/ikebana1.jpg">
 <tr>
  <th rules="none">
   <td colspan="2">
   <table border="0" align="left">
    <font color="#000000" alink="#000000">
    <h1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="MamaHP.html">Ikebana</a><br></h1>
    </font>
   </table>
    </td>
   </th>
  </tr>
</table>

<font face="Arial Rounded MT Bold">
<table width="20%" height="100%" border="2" cellspacing="0" cellpadding="0" align="left" bordercolor="#000000" background="images/ikebana1.jpg">
   <tr align="center" width="20%" height="25%">
     <td>
    <font size="4" color="#000000">
       <strong>
    <hr align="left" width="1" size="1" noshade>
    </strong>
       </font>
  </td>
   </tr>
   <tr align="center" width="0" height="0">
     <td>
    <font size="4" color="#000000">
       <strong>
    <p><a href="Zur Person.html">Zur Person</a></p>
    </strong>
       </font>
  </td>
   </tr>
   <tr align="center" width="0" height="0">
     <td>
    <font size="4" color="#000000">
       <strong>
    <p>Galerie</p>
    </strong>
       </font>
  </td>
   </tr>
   <tr align="center" width="0" height="0">
     <td>
    <font size="4" color="#000000">
       <strong>
    <p><a href="Unterricht.html">Termine</a></p>
    </strong>
       </font>
  </td>
   </tr>
   <tr align="center" width="0" height="0">
     <td>
    <font size="4" color="#000000">
       <strong>
    <p><a href="Kontakt.html">Kontakt</a></p>
    </strong>
       </font>
  </td>
   </tr>
   <tr align="center" width="0" height="0">
     <td>
    <font size="4" color="#000000">
       <strong>
    <p><a href="Impressum.html">Impressum</a></p>
    </strong>
       </font>
  </td>
   </tr>
</table>
</font>
<br><br><br><br><br><br><br>
<table width="90%" height="20%" border="0" cellspacing="0" cellpadding="0" align="right" bordercolor="#000000">
  <tr>
   <th>
     <td wight="0" height="0" align="center">
          <font color="#000000">
    <h1>Galerie<br></h1>
    </font>
    <font color="#FFFFFF">
    <h2><font color="#FFFFFF">Ikebana</font></h2><br><br>
     </td>
   </th>
 </tr>
</table>
</body>
</html>

Bin für jede Hilfe dankbar und habt erbarmen mit einer Anfängerin!
(bestimmt sind sehr viele Fehler drin und erst die Übersicht!)

Grüße Roberta
Danke!

  1. Die Internetseite:
    http://www.barbarahuebner.de

    Sorry, noch eine Ergänzung:

    Bei der Internetseite auf "Ikebana" klicken. Danke.

  2. Hallo Roberta,

    Womit erstellst du den HTML-Code? Es tut mir leid, das sagen zu müssen, aber das ist einfach nur ne Katastrophe.

    Tabellen verschachteln ist sinnfrei, Tabellen in <font>-Elemente packen ist grob falsch. font-Elemente selbst sollte man vermeiden. Tabellen für Layout-Zwecke eigentlich auch. Und Attribute, die die Darstellung regeln, wie bgcolor="#99cc66", text="#FFFFFF" usw. sowieso.

    Ich kann dir raten, versuchs nochmal neu, schreib den HTML-Code komplett selbst, lerne CSS, und teste vor allem zuerst mit dem Firefox oder Opera, jedenfallsm it einem guten Browser und nicht mit so einem veralteten Müll wie dem IE.

    Jonathan

    1. Hallo Roberta,

      Womit erstellst du den HTML-Code? Es tut mir leid, das sagen zu müssen, aber das ist einfach nur ne Katastrophe.

      Mit HomeSite 5, bestimmt total veraltet.

      Ich kann dir raten, versuchs nochmal neu, schreib den HTML-Code komplett selbst, lerne CSS

      Na, dann... an die Arbeit.
      Naja, aber danke.

    2. Ich kann dir raten, versuchs nochmal neu, schreib den HTML-Code komplett selbst, lerne CSS, und teste vor allem zuerst mit dem Firefox oder Opera, jedenfallsm it einem guten Browser und nicht mit so einem veralteten Müll wie dem IE.

      @ Barbara, mit dem IE muß man eh testen. Also nach den Regeln schreiben und dann so hinbiegen, daß es in "beiden" Browsern paßt. Am besten man sucht sich für den Anfang ein fertiges Grundlayout (Seitenaufteilung), das für "beide" Browser fit sein soll, schaut es sich an, versteht es möglichst und paßt es an.

      z.B: das http://www.css4you.de/wslayout1/ex0008.html

      1. Hallo Texter,

        z.B: das http://www.css4you.de/wslayout1/ex0008.html

        Wobei das keine wirlich tolle Vorlage ist. Das Menü sollte man z.B. einfach als Liste realisieren.

        Jonathan

  3. Hallo,

    Bin für jede Hilfe dankbar und habt erbarmen mit einer Anfängerin!
    (bestimmt sind sehr viele Fehler drin und erst die Übersicht!)

    Wenn du eine Anfüngerin bist ist folgendes schon mal ein wichtiger Schritt in die richtige Richtung: Der DOCTYPE-Switch und seine Auswirkungen.

    Dann solltest du auch deine Quelltexte immer mit einem Validator überprüfen: W3C-Validator, Validome.

    Gruß

  4. Liebe Roberta,

    1)  Die Tabellen werden nicht nebeneinander angezeigt (habe es schon mit div probiert, scheint aber nicht zu funktionieren)

    1. Die beiden Tabellen sollen so stehen:

    xxxxxxxxxxxxxxxxxxxxxxxx
    xxxxxxxxxxxxxxxxxxxxxxxx
    xxx
    xxx
    xxx
    xxx
    xxx
    xxx

    Du sprichst von http://www.barbarahübner.de/MamaHP.html, nicht wahr?

    Dein Problem liegt darin begründet, dass Du versuchst, das Aussehen Deiner Seite mit strukturellen Elementen zu erreichen. Das hat man im letzten Jahrtausend so machen müssen, da es keine sinnvollere Möglichkeit gab. Heute trennt man die Darstellung vom Inhalt. Näheres dazu im hiesigen SELFHTML: <http://de.selfhtml.org/css/layouts/einfuehrung.htm@title=Einführung in CSS-basierte Layouts>.

    Wenn Du es "gleich richtig" machen willst, dann verfolge diesen Ansatz:

    <body>  
        <div id=inhalt">  
            <h1>Ikebana Barbara Hübner</h1>  
            <p>...</p>  
        </div>  
      
        <div id="navigation">  
            <h2>Navigation</h2>  
            <ul>  
                <li><a href="#">Zur Person</a></li>  
                <li><a href="#">Galerie</a></li>  
                <li><a href="#">Termine</a></li>  
                <li><a href="#">Kontakt</a></li>  
                <li><a href="#">Impressum</a></li>  
            </ul>  
        </div>  
    </body
    

    Bitte gewöhne Dir an, Verzeichnis-Namen und Dateinamen für Webseiten immer ohne Leerzeichen zu schreiben (verwende stattdessen den _Unterstrich_), und vermeide jegliche Ümläute oder ßonderzeichen. Am Besten ist es, wenn Deine Datei- und Verzeichnisnamen alle aus Kleinbuchstaben bestehen. Du vermeidest Damit unnötige Komplikationen.

    Dass das obige Beispiel noch nicht wirklich prickelnd aussieht, ist klar. Aber wenn Du diese Struktur (ich rede nicht von Aussehen, merkst Du's?) in allen Deinen Seiten hast, dann kann man diese Struktur Layouten.

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
  5. Hallo

    Bin für jede Hilfe dankbar und habt erbarmen mit einer Anfängerin!

    Auf den Seiten zur Heilpaxis, ist unten so viel *Nichts*, daß man den Inhalt nach oben rausscrollen kann, falls es noch nicht aufgefallen ist. Ich habe aber nicht nachgeschaut woran es liegen könnte.