Lektion 3 : Ränder, Margins, Abstand
Nahtlose Übergänge der Frameinhalte ohne Abstände und Ränder sind oft erwünscht. Schließlich ist die Aufteilung der Seite nicht mehr offensichtlich, wenn sie die Hintergrundfarben in allen Dateien anpassen und Ränder abgeschaltet sind.
Ränder Zwischeräume Innenabstand (spacing, margin)
Auch in Frames sieht der Browser (genau wie in einer HTML-Datei) standardmäßig Abstände zum Fensterrand und zur Framegrenze vor. Meißt nur wenige Pixel aber summiert mit den Rändern der HTML-Datei geht doch Anzeigebereich verloren. Nicht so schlimm, eigentlich. Wenn sie allerdings genau berechnete Inhalte anzeigen möchten und die Framebreite passend eingetragen haben, kann das schon zu einem störenden Scrollbar führen.
Legt man Ränder und Innenabstand für die Anzeigebereiche nicht fest, würde der Browser seine Standardwerte verwenden. Leider sind die nicht für jeden Browser gleich. Also nehmen wir das besser selbst in die Hand!
3.1 Frame-Innen-Abstand (margin)
Sie können die Abstände zwischen Rand und Inhalt der Frames bestimmen. Dazu werden die Attribute "marginwidth" und "marginheight" notiert. (Angaben in Pixel)
- horizontaler Abstand mit marginwidth
- vertikaler Abstand mit marginheight
Sie werden den Wert '0' eintragen.
|
|
<html>
<head>
</head>
<frameset cols="250,*">
<frame name="nav" src="menue.htm" marginwidth="0" marginheight="0">
<frame name="anzeige" src="start.htm" marginwidth="0" marginheight="0">
</frameset>
</html>
3.2 Frame-Abstand (framespacing)
Sie können die Abstände zwischen den Frames bestimmen. Dazu wird das Attribute "framespacing" eingesetzt. Der Wert wird in Pixel eingetragen.
Üblicherweise möchten sie keinen Abstand, tragen also den Wert '0' ein.
|
|
<html>
<head>
</head>
<frameset framespacing="0" cols="250,*">
<frame name="nav" src="menue.htm" marginwidth="5" marginheight="5">
<frame name="anzeige" src="start.htm" marginwidth="5" marginheight="5">
</frameset>
</html>
3.3 Frameset Ränder (border)
Sie können bestimmen ob Ihr Frameset Ränder hat. Dazu wird das Attribut "border" benötigt.
(Angaben in Pixel)
<html>
<head>
</head>
<frameset frameborder="0" border="0" framespacing="0" cols="250,*">
<frame name="nav" src="menue.htm" marginwidth="0" marginheight="0">
<frame name="anzeige" src="start.htm" marginwidth="0" marginheight="0">
</frameset>
<noframes>
Ihr Browser unterstützt keine Frames!
</noframes>
</html>
Trotzdem gibts immer noch Unterschiede, schaut man die Seite mit unterschiedlichen Browsern an. Versuchen sie doch einmal eine Kombination aus:
- frameborder="0"
- framespacing="0"
- border="0"
- bordersize="0"
Berechnungen für ein Layout
(Themenfremd aber noch einmal zur Erinnerung)
Auch für die HTML-Seite ist browserseitig ein Standardrand vorgesehen. Zusätzlich könnten (nicht eingetragene) Margin- und Paddingwerte von Tabellen für Ärger sorgen.
Lesen sie dazu (später) meine Erklärungen zu Fehlerquellen bei der Layouberechnung
Die Innenabstände bei HTML-Dateien lassen sich mit CSS leicht auf Null setzen:
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
}
oder für explizite Anweisungen mit
body {
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom:0px;
}
-->
</style>

|