Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 11

Thema: Layout der Seite wird im IE falsch dargestellt

  1. #1
    HTML Newbie
    Registriert seit
    04.01.2009
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Layout der Seite wird im IE falsch dargestellt

    Hallo zusammen,

    ich soll für meine Schule eine Homepage erstellen. Bisher beschränkt sich meine Erfahrung auf das Instandhalten von einer Internetseite. Dort hatte ich also eine Vorlage, die ich lediglich weiterbearbeiten musste. Die läuft allerdings über frames, die ich jetzt nicht benutzen wollte/sollte/konnte.

    Also habe ich die Schulseite mit Kompozer per Learning by Doing aufgebaut. Sieht im Firefox auch echt ganz gut aus. Im Internet-Explorer wird mir allerdings das Format zerschossen. Und ich hab nicht so wirklich Ahnung, wie ich den Fehler rausbekomme. Zumal ich ja ziemlicher Anfänger bin und auch Schwierigkeiten mit diesem ganzen Fachvokabular hab.
    Wahrscheinlich steht die Lösung schon zwanzigmal hier und ich bin einfach zu doof, sie zu finden.

    Damit ihr wisst, was ich meine, hab ich im Anhang drei Bilder. So, wie es eigentlich aussehen sollte (wie es FF auch anzeigt), dass, was der Schul-PC draus macht (ein etwas ältere Version des IE) und das, was die neueste IE-Version draus macht.

    Ich hab jetzt keine Ahnung, was vom Quelltext ich posten muss, damit ihr mir weiterhelfen könnt, deswegen geb ich Euch mal alles. Ich hoffe, ihr verliert dann nicht völlig den Überblick

    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html style="direction: ltr;" lang="de-de">
    <head>
      <meta content="text/html; charset=ISO-8859-1"
     http-equiv="content-type">
      <title>XXXXXXX</title>
      <meta
     content="XXXXXXXXXXXXX"
     name="description">
      <link rel="stylesheet" href="../stylesheet.css"
     type="text/css">
    </head>
    <body
     style="background-image: url(../../bilder/mauer_hintergrund.jpg); direction: ltr;">
    <img src="../../bilder/titelzeile_schild.jpg"
     alt="Astrid-Lindgren-Schule"
     style="border: 3px solid ; width: 213px; height: 160px; float: left;">
    <table style="height: 158px;">
      <tbody>
        <tr>
          <td style="height: 117px;" colspan="7"
     rowspan="1"><img style="width: 700px; height: 100px;"
     alt="XXXXXXXXXXX"
     src="../../bilder/titelzeile_schriftzug.gif"></td>
        </tr>
        <tr>
          <td
    style="background-position: center; background-repeat: no-repeat; text-align: center; height: 40px; width: 140px; background-image: url(../../bilder/buttons/button.jpg);"><a
     class="menue" href="../home.html">Home</a><br>
          </td>
          <td
    style="background-position: center; background-repeat: no-repeat; height: 40px; width: 140px; background-image: url(../../bilder/buttons/button.jpg);"><span
     style="color: rgb(255, 200, 0);" class="menue">Info</span><br>
          </td>
          <td
    style="background-image: url(../../bilder/buttons/button.jpg); background-position: center; background-repeat: no-repeat; height: 40px; width: 140px;"><a
     class="menue" href="../schueler.html">Schüler</a><br>
          </td>
          <td
    style="background-image: url(../../bilder/buttons/button.jpg); background-position: center; background-repeat: no-repeat; height: 40px; width: 140px;"><a
     class="menue" href="../wir.html">Wir</a><br>
          </td>
          <td
    style="background-image: url(../../bilder/buttons/button.jpg); background-position: center; background-repeat: no-repeat; height: 40px; width: 140px;"><a
     class="menue" href="../schulleben.html">Schulleben</a><br>
          </td>
          <td
    style="background-image: url(../../bilder/buttons/button.jpg); background-position: center; background-repeat: no-repeat; height: 40px; width: 140px;"><a
     class="menue" href="../kontakt.html">Kontakt</a><br>
          </td>
        </tr>
      </tbody>
    </table>
    <br>
    <ul style="width: 170px;" id="Navigation">
      <li><a href="aktuelles.html">Aktuelles</a></li>
      <li><a href="rundgang.html">Rundgang</a></li>
      <li class="link">Schule</li>
      <li><a href="angebot.html">Angebot</a></li>
    </ul>
    <div style="margin-left: 221px; width: 755px;" id="Inhalt"><br>
    Hier steht dann der Text....
    <br>
    <br>
    </div>
    <br>
    <br>
    </body>
    </html>
    Dazu hab ich dann noch ein externes CSS-Stylesheet, das sieht so aus:

    Code:
    /* Generated by KompoZer */
    body {
      font-family: Helvetica,Arial,sans-serif;
    }
    table {
      border-style: none;
      border-width: 0px;
      text-align: center;
      background-color: transparent;
      font-weight: bold;
    }
    a:link {
      color: #333333;
      font-weight: bold;
    }
    a:visited {
      color: #333333;
      font-weight: bold;
    }
    a:hover {
      color: #c0c0c0;
      font-weight: bold;
    }
    a:active {
      color: #ff0000;
      font-weight: bold;
    }
    a.menue:link {
      font-weight: bold;
      color: #333333;
      text-decoration: none;
    }
    a.menue:visited {
      font-weight: bold;
      color: #333333;
      text-decoration: none;
    }
    a.menue:hover {
      color: #c0c0c0;
      font-weight: bold;
      text-decoration: none;
    }
    a.menue:active {
      color: #ff0000;
      font-weight: bold;
      text-decoration: none;
    }
    ul#Navigation {
      margin: 0;
      padding: 0;
      float: left;
      width: 22em;
      color: #333333;
      font-size: medium;
      line-height: 30px;
    }
    ul#Navigation li {
      margin: 0;
      padding: 0.5em;
      list-style-type: none;
      list-style-image: none;
      list-style-position: outside;
    }
    ul#Navigation a {
      padding: 0.2em;
      display: block;
      font-weight: bold;
    }
    ul#Navigation a:link {
      background-image: url(../bilder/buttons/button.jpg);
      background-position:  center center;
      background-repeat: no-repeat;
      text-align: center;
      color: #333333;
      text-decoration: none;
    }
    ul#Navigation a:visited {
      background-image: url(../bilder/buttons/button.jpg);
      background-position:  center center;
      background-repeat: no-repeat;
      text-align: center;
      text-decoration: none;
      color: #333333;
    }
    ul#Navigation a:hover {
      background-image: url(../bilder/buttons/button.jpg);
      background-position:  center center;
      background-repeat: no-repeat;
      text-align: center;
      text-decoration: none;
      color: silver;
    }
    ul#Navigation a:active {
      background-image: url(../bilder/buttons/button.jpg);
      background-position:  center center;
      background-repeat: no-repeat;
      text-align: center;
      text-decoration: none;
      color: red;
    }
    div#Inhalt {
      border: 4px double #ff9600;
      padding: 0 1em;
      min-width: 16em;
      background-color: #ffffcc;
      margin-left: 30em;
    }
    li.link {
      margin: 0;
      padding: 0.5em;
      background-position:  center center;
      background-repeat: no-repeat;
      font-weight: bold;
      color: #ffc800;
      text-align: center;
      display: block;
      font-size: medium;
      line-height: 36px;
      height: 36px;
      background-image: url(../bilder/buttons/button.jpg);
    }
    h1 {
      font-size: large;
      font-weight: bold;
      font-style: normal;
      text-transform: none;
      text-align: left;
      line-height: normal;
    }
    Also, es wäre echt super lieb, wenn ihr mir da weiterhelfen könntet...
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Angehängte Grafiken Angehängte Grafiken
    Geändert von Lacrima (04.01.2009 um 21:37 Uhr)

  2. #2
    Meister(in)
    Registriert seit
    05.03.2006
    Alter
    29
    Beiträge
    432
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Die Versionen der IEs mit denen du getestet hast wären noch hilfreich. Allerdings sollte sich das auf 6 und 7 beschränken. Für ältere IEs solltest du die Seite nicht optimieren. Ich persönlich finde IE 6 auch schon kritisch, aber nutzen halt noch zu viele, leider.

    Der 6er stellts bei mir allerdings schon genauso dar wie Firefox.

  3. #3
    Youngster
    Registriert seit
    22.06.2008
    Beiträge
    14
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Ich nehme mal an deine Schule hat den Internet Explorer 5.5 oder 6.
    Diese Browser verbreitern Block-Elemente (z.B <div>) wenn der Inhalt da nicht reinpasst. Vermutlich deswegen passt die Inhaltsbox (id="Inhalt") nicht neben die Navigation und rutscht unter die Navigation.

    Dein Beispielinhalt besteht nur aus Text. Damit kann ich den Fehler nicht erkennen.
    Wenn ich aber z.B ein breites Bild einfüge sieht es im IE5.0-IE6 so aus wie auf deinem mittleren screenshot.
    Geändert von Neuroleptika (04.01.2009 um 22:57 Uhr)

  4. #4
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Tja wenn schon Tabelle dann richtig. Erzeuge eine Tabelle (Grundaufbau) mit einem Header der die Grafik der Schule (Logo) mit einschließt und der Navi in einer Spalte und dem Content in einer Spalte. Besser wäre der konsequente Neubeginn in CSS ohne Tabelle!!

    Und dann postest Du das ganze als angehängte Datei mit den Grafiken im gepackten Zustand, damit wir auch was sehen. Dann sehen wir weiter.
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    04.01.2009
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    also, danke schon mal für die bisherigen Antworten

    @FaFoo
    Welche IE-Version wir in der Schule haben, kann ich erst am Mittwoch nachsehen.
    Wäre halt schon gut, wenn zumindest dort die Seite ordentlich angezeigt wird

    Der andere IE, der die Titelzeile nach unten verschoben hat, hat die Version 8Beta.

    @Neuroepileptika:
    Also in der ursprünglichen Seite steht in dem div auch nur Text, keine Bilder oder.
    Es ein ganz normaler Fließtext - halt mit Informationen über die Schule. Hab die auch nur deswegen rausgenommen, weil die Seite eben noch off ist und mich ja nicht gleich jeder erkennen muss
    Wenn es aber daran liegen sollte, was muss ich denn tun, damit der Fehler nicht mehr auftaucht?

    @yeti66

    das sagt sich immer leicht, wenn man weiß, wovon man redet. Ich bin halt nen Anfänger.
    Eigentlich wollte ich auf Tabellen verzichten - vor allem im Sinne von barrierefreiem Web.
    Ich hab das aber über CSS nicht hingekriegt, weil ich mich damit fast gar nicht auskenne. Ich hab mich ein bisschen im Internet eingelesen und dann ausprobiert. Die meisten Seiten sind so kompliziert geschrieben, dass das ein Anfänger halt nicht checkt.
    Also nützt mir der Rat "mach alles in CSS" nicht so viel, weil ich nicht weiß, wie ichs machen soll

  6. #6
    Youngster
    Registriert seit
    22.06.2008
    Beiträge
    14
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Zitat Zitat von Lacrima Beitrag anzeigen
    Es ein ganz normaler Fließtext - halt mit Informationen über die Schule. Hab die auch nur deswegen rausgenommen, weil die Seite eben noch off ist und mich ja nicht gleich jeder erkennen muss
    Wenn es aber daran liegen sollte, was muss ich denn tun, damit der Fehler nicht mehr auftaucht?
    Gucke es dir erstmal so in der Schule an wie du es uns gezeigt hast.
    Mit deinem Mustertext passt es ja im IE6.
    Dann stellst du den Zustand stückchenweise wieder so her bis der Fehler wieder auftaucht.
    Ohne Testmöglichkeit ist das natürlich etwas nervig.

    Der andere IE, der die Titelzeile nach unten verschoben hat, hat die Version 8Beta.
    Das ist halt noch Beta. Der neuste offizielle IE ist Vers.7.
    Geändert von Neuroleptika (05.01.2009 um 15:36 Uhr)

  7. #7
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Ok, dann biete ich Dir an ,unter der Voraussetzung, das Du Dich mit dem Container-Layout beschäftigst, das Grundlayout zu basteln wenn Du mir die Bilder zukommen lässt. Ist das ein Angebot?
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

  8. #8
    HTML Newbie
    Themenstarter

    Registriert seit
    04.01.2009
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    das klingt nach nem ziemlich netten angebot
    Welche Bilder brauchst Du denn? Auch die Hintergrundbilder der Seite und der Buttons?
    Ich les mich schon mal ein

  9. #9
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Ich würde sagen erst mal alles und dann sehen wir weiter was wir verwenden. Definiere möglichst genau was Du Dir vorstellst und in wieweit ich eigene Vorstellungen umsetzen kann und dann geht es los.
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

  10. #10
    HTML Newbie
    Themenstarter

    Registriert seit
    04.01.2009
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Layout der Seite wird im IE falsch dargestellt

    Also, ich hab das heute mal überprüft und in der Schule haben wir Version 7 des IE.
    Und da fängt der Textblock mit dem Inhalt erst unterhalb der Menüleiste an.

    @yeti66: ich schreib dir mal ne PN

Ähnliche Themen

  1. Seite wird im IE falsch dargestellt!
    Von Blazor im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 07.04.2007, 23:45
  2. Schrift wird falsch dargestellt!
    Von Cyberphreak im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 29.11.2006, 08:27
  3. Layout wird im FF falsch dargestellt, im IE richtig
    Von Frodo im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 12.03.2006, 11:42
  4. CSS Design wird im IE falsch dargestellt
    Von Empon im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 22.06.2005, 20:22
  5. index.html wird falsch dargestellt
    Von Knorkator im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 21.12.2004, 12:30

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •