[CSS] Webseite mit CSS

X

X5-599

Gesperrt
Gesperrt
So Leute, jetzt brauche ich auch mal euer Wissen :-)


Da ja immer gesagt wird das Frames veraltet sind und man es nicht mehr nutzen soll, habe ich mir ein CSS Template runtergeladen.

Das Template sieht so aus:
http://www.ahs-amiga.ch/div/frame.jpg

Auf jedenfall scheint alles unter IE7 einwandfrei zu laufen.
Nehme ich Opera ist die Schrift viel zu gross und haut mir das ganze Design durcheinander. FF habe ich noch nicht ausprobiert.

Da wo ich das Template runtergeladen habe, hiess es, dass es auf diversen Browsern, auch Opera, getestet wurde.

Wieso also kann ich denn die Seite bei mir nur auf IE richtig anzeigen, beim Opera aber nicht. Ach ja, es war der Opera auf Mac Basis der dort als getestet angezeigt wurde.
 
Stromer92

Stromer92

Stammgast
könntest du mal ein screenshot vom gut aussehnden (damit wir wissen wie es aussehen sollte) und eines vom schlechten raufladen?
 
froeschli

froeschli

Stammgast
Es kann sein, dass lediglich CSS Regeln zum Layout definiert wurden. Somit würde die Standardschrift vom Browser benutzt werden. Wenn diese nun etliches grösser ist im Opera, verzieht es dir natürlich das ganze Layout. Versuche mal folgende Regel einzubinden:

Code: 
body {
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:small;
}

Damit wird die Standardschriftfamilie und -grösse gesetzt.

Gruss froeschli
 
X

X5-599

Gesperrt
Gesperrt
Die Schriftarten sind im CSS ebenfalls definiert.

Von daher müsste ja eigentlich jeder die gleiche Schrift verwenden.

Ein Foto kann ich nicht Uploaden, da die Webseite noch nicht freigegeben wurde und ehrlich gesagt habe ich keine Lust den Text wieder zu löschen und neuen reinzuschreiben nur damit ihr das Beispiel seht :-)
Bin halt etwas faul :-)

Aber das hier ist im CSS eingerichtet:
Code: 
body {
background-color: #e1ddd9;
font-size: 11px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#300080;
padding:0px;
margin:0px;
}
a {color: #300080;}
a:visited {color:#FF0000;}
a:hover {color: #FF0000;}
a:active { color:#300080;}

h1 {
font-size: 11px;
text-transform:uppercase;
background-color: #E0A3B7;
border-top:1px solid #564b47;
border-bottom:1px solid #564b47;
padding:5px 15px;
margin:0px }

h2 {
font-size:20px;
font-weight: normal;
padding: 5px 10px;
margin:0px;}





Ach ja, das mit der Schrift könnt ihr euch so vorstellen. Während mit dem IE die Schrift schön in der linken Zelle steht (siehe obiges eingefügtes Bild), ist bei Opera die Schrift so gross das sie über den Rand hinaus auch in der rechten Zelle steht.
Ausserdem ist der ganze Rahmen auch bei Opera wesentlich grösser. Bei IE wird es einwandfrei auf dem Bildschirm angezeigt. Bei Opera muss ich runterscrollen um auch den unteren Teil zu sehen.
Hoffe man versteht was ich meine. Sonst werde ich doch noch eine Seite generieren und für euch hochladen.
 
Zuletzt bearbeitet von einem Moderator:
sergey

sergey

Stammgast
Jup, würd da sagen folgendes Problem:

Die Browser interpretieren die Schriftgrösse anders.

Hab das Problem manchmal auch, aber ich lös das dann so, dass ich den Bereich der überlappt vergrössere.

Gruss

sergey
 
X

X5-599

Gesperrt
Gesperrt
Wenn es nur die Schrift wäre, aber er interpretiert ja auch die Blockgrösse anders.

Der Rahmen ist bei Opera ja auch noch grösser als unter IE


Scheint als hätte ich zumindest ein Problem lösen können. Habe die Schriftgrösse/Art in der CSS Vorlage neu definiert.
Mal sehen ob ich das auch mit der grösse des Rahmens noch hinbekomme.

Daher schonmal danke für eure Hilfe
 
Zuletzt bearbeitet:
froeschli

froeschli

Stammgast
abu schrieb:
Quizfrage: Wieviel Interpretationsspielraum bietet die Definition "font-size: 11px;"? ;)
Zum Vergrößern anklicken....

Kommt ganz drauf an, ob der Browser das gleich umrechnet. Zum Beispiel, wenn der Benutzer eine Sehschwäche hat und sich allen Text immer vergrössern lässt.... ;)

Wir haben das Thema im Freifach Web Accessibility für Behinderte behandelt. :)

Gruss froeschli
 
X

X5-599

Gesperrt
Gesperrt
abu schrieb:
Quizfrage: Wieviel Interpretationsspielraum bietet die Definition "font-size: 11px;"? ;)
Zum Vergrößern anklicken....

Das musst du die Webbrowser Programmierer fragen.

Genau wie die Frage wieso er widht=800px unterschiedlich interpretiert.

Scheinbar hat Opera da eine andere Pixelgrösse als der IE.

Würde mich nur zu sehr interessieren wie es auf dem FF aussieht.
 
sergey

sergey

Stammgast
Jetzt mal die ganz einfache Frage:

Welche Version von IE verwendest du für den Test?

Naja, ich kann dir da nicht sagen, aber auf jeden fall interpretiert jeder Browser das anders. Ich habe bei mir die Einstellungen immer genau gleich, aber der IE stellt die Schrifgrösse kleiner dar als im FF.

Gruss

sergey
 
Dragonlord

Dragonlord

PCtipp-Moderation
Teammitglied
Frames

Also ich habe schon mehrere Webseiten mit Div's anstelle von Frames erstellt. Alle Webseiten haben auf allen Browsern immer genau gleich ausgesehen. Das gilt sowohl auf PC-, als auch auf MAC-Seite.

Versuche doch mal Dein Problem mit Div's zu lösen. Dann wirst Du auch keine Probleme mit der Darstellung in den verschiedenen Browsern haben.

lg Roger
 
X

X5-599

Gesperrt
Gesperrt
X5-599 schrieb:
Auf jedenfall scheint alles unter IE7 einwandfrei zu laufen.
Nehme ich Opera ist die Schrift viel zu gross und haut mir das ganze Design durcheinander. FF habe ich noch nicht ausprobiert.
Zum Vergrößern anklicken....

Ich vermute mal den hier, sonst würde ich wohl kaum erwähnen dass ich den benutze :-)

Und nein danke, ich bleibe beim CSS.
Ist zwar massivst umständlicher als mit Frames, daher kann ich nicht verstehen wieso soviele Leute auf CSS umsteigen aber was solls.

Villeicht ändere ich meine Meinung noch und steige wieder auf Frames um.

Also aus meiner Sicht kann der Thread geschlossen werden
 
Dragonlord

Dragonlord

PCtipp-Moderation
Teammitglied
Frames

Das mit dem Umsteigen auf Frames würde ich mir nochmals überlegen.

Denn der kommende Standard von XHTML 2.0 wird definitiv keine Frames mehr unterstützen. Auch XHTML 1.1 unterstützt schon keine Frames mehr.

lg Roger
 
sergey

sergey

Stammgast
Sry, hatte ich übersehen.

Eigentlich meinte Dragonlord ja auch CSS, den div kommt aus dem Bereich CSS und ist für einen Bereich angegeben. Also für die Aufteilung auf der Webseite.

Unter IE v.6 und tiefer musst du aber den Boxmodel Bug noch beachten, da hat Microsoft nicht so gründlich programmiert.

Gruss

sergey
 
X

X5-599

Gesperrt
Gesperrt
Ja und mit IPv6 gehen diverse andere sachen nicht.

Aber mal ehrlich, was interessiert mich welcher Programmierstandard was unterstützt? Mich interessiert was der Browser unterstützt und die werden vermutlich auch in 10 Jahren noch Frames unterstützen.

Aber wie schon gesagt, lassen wir das Frames Thema :-)

Tatsache ist doch aber das CSS wesentlich mehr Aufwand bedeutet und mehr Traffic verursacht.
Da im Grunde jede Seite immer neu geladen werden muss und ändert was an der Grundeinstellung, z. B. ein neuer Link, muss der auf jeder Seite neu geschrieben werden.

Bei Frames musste man dies nicht.

Dann höre ich das die älteren Browser noch Probleme mit CSS haben. Also das nächste Problem. Viele Leute surfen noch mit älteren Browsern.
Also wieder ein grund gegen CSS?
 
Stromer92

Stromer92

Stammgast
CSS ist aufwändig? Nie past du deine Webseite einfach an als mit CSS!

Mit einer neuen CSS datei verpasst du deiner webseiten in einer stunde einen komplett neuen style. Und wenn du CSS mal beherrscht... Es ist so einfach und übersichtlich, alles säuberlich in einer datei angeordnet und ohne grössere umstände zu finden und ändern.

Ich möchte CSS nie mehr missen, aber Frames *kotz*
 
A

abu

Guest
Stromer92 schrieb:
CSS ist aufwändig? Nie past du deine Webseite einfach an als mit CSS!
Zum Vergrößern anklicken....

Zum Lernen ist es schon aufwändig, finde ich. Aber wenn man es dann mal drin hat: WOW. Auch ich will nie mehr zurück. ;)

Die strikte Trennung von Content und Style ist das einzig Richtige.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Oben