Zeilenumbrüche im Firefox

Status
Nicht offen für weitere Antworten.
A

Annika2711

Grünschnabel
Hallo zusammen,
ich hänge mal wieder an meiner tollen Seite fest :(
Also diesmal liegt das Problem bei den Zeilenumbrüchen im Firefox. Und zwar, wenn ich die Größe meines Browserfensters verändere, also dran rum zerre und schiebe, legt sich sämtliche Schrift einfach übereinander, bis man nichts mehr lesen kann.
Im IE funktionierts so einigermaßen zufriedenstellend. Dort werden halt Umbrüche eingefügt und die Links werden untereinander aufgeführt.
Desweiteren hab ich noch das Problem, dass wenn ich meine Seite editieren will (also ist ein moinmoin Wiki) und auf den Button gehe, dann verschwindet die graue Leiste (habe mal ein paar Screenshots angehängt). Dafür find ich auch keine so richtige Erklärung.
CSS ist leider immer noch ein monströses Rätsel für mich :(
Über Hilfe würde ich mich riiiiesig freuen!

Viele Grüße Annika
 

Anhänge

  • common..txt
    5,1 KB · Aufrufe: 29
  • screen..txt
    6,1 KB · Aufrufe: 25
  • Verschiebung.doc
    120 KB · Aufrufe: 29
  • Schrift übereinander.doc
    141,5 KB · Aufrufe: 39
  • So sollte es sein.doc
    143 KB · Aufrufe: 30
  • Quellcode.txt
    10,7 KB · Aufrufe: 32
Hi,

das Umbrechen der Elemente beim Verkleinern des Fensters lässt sich mit Hilfe einer Mindestbreite min-width abstellen.

Hierfür wird das bestehende Layout in eine weitere Box #wrapper eingebettet:

Code: 
<body  lang="de" dir="ltr">
<div id="wrapper">
        <!-- Hier folgt das bestehende Layout -->
</div>
</body>
und diese wie folgt formatiert:

Code: 
#wrapper {
min-width:900px;
}
Eigentlich wäre es das schon gewesen, nur dummerweise unterstützen die Vorgängerversionen des IE7 diese CSS-Eigenschaft überhaupt nicht, und benötigen deshalb einen Workaround, wie ihn beispielsweise Stu Nicholls in seinem Beispiel Min-Width for Internet Explorer vorstellt:

Code: 
/* Für IE6 */
* html .minwidth {
border-left:900px solid #fff; 
position:relative; 
float:left; 
z-index:1;
}
* html .container {
margin-left:-900px; 
position:relative; 
float:left; 
z-index:2;
}
Der neue HTML-Code lautet nun:

Code: 
<body  lang="de" dir="ltr">
<div id="wrapper">
     <div class="minwidth">
          <div class="container">
               <!-- Hier folgt das bestehende Layout -->
          </div>
     </div>
</div>
</body>
Zu dem Verschwinden der grauen Leiste kann ich derzeit nicht viel sagen, da in dem angehängten Dokument kein "Edit-Button" enthalten ist.

Und gewöhne dir doch bitte an, deine Screenshots hier direkt als Grafiken, und nicht als *.doc-Dateien hochzuladen, denn nicht jeder nutzt das Textverarbeitungsprogramm aus dem Hause "Microsoft". Außerdem kann man sich dann den Schnappschuß direkt mit einem Klick betrachten, und muss nicht erst diesen Umweg beschreiten. Vielen Dank. ;)
 
Supi, vielen Dank! Werde das dann ausprobieren und mein Glück versuchen! :)
Und wegen den shots... ich weiß, ich weiß.. ich bin nicht so das PC-Genie^^ Tut mir leid! Demnächst dann als Grafik :)
Lieben Gruß
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück