nicht angemeldet
Hallo,
a:hover{color: #FFFF99; font-weight:bold; text-decoration: underline; text-shadow: black; }
text-shadow unterstützt meines Wissens kein Browser (es gibt aber irgendeinen sehr lahmen Microsoft Filter dafür, http://selfhtml.teamone.de/css/eigenschaften/filter.htm#drop_shadow).
... font-family:Verdana,Arial,Helvetica; ...
Die Schriftart/-familie kannst du im Grunde auch einmal im body definieren, und bitte gib eine generische Schriftfamilie an (in diesem Fall: serifenlos, folglich »sans-serif«, http://selfhtml.teamone.de/css/eigenschaften/schrift.htm#font_family): font-family:Verdana,Arial,Helvetica,sans-serif; beispielsweise.
body {background-color:#6699FF; width:96%; cellspacing:0; height:96%; padding:1%; }
Die Eigenschaft cellspacing gibt es nicht (es wurde meiner Erinnerung nach schon gesagt, verzeihe, falls ich mich/jemanden wiederhole).
#rahmen { border-style:ridge; border-collapse:collapse; border-color:white;}
border-collapse gilt nur für Tabellen. Auch solltest (bzw. willst) du wahrscheinlich border-width angeben/festlegen.
Egal welche Werte ich (<100%) reintrage, der Rahmen ist immer im Feld, begrenzt es daher nicht.
Du wirst es auf diese Weise nicht lösen können. Zunächst einmal müsstest du margin und padding von html und body deaktivieren, eben bis auf padding:1% bei body. Mit folgendem wärst du schon relativ weit, nur Opera 7 muckt herum (vielleicht, weil der den MSIE-box model bug imitiert? Es ist ja kein DOCTYPE angegeben. Aber MSIE macht alles wie gewünscht, aber dennoch handelt er unlogisch):
html {margin:0; padding:0;}
body {margin:0; padding:1%; height:96%; border:3px ridge white; background-color:#6699ff;}
body füllt html aber nie vollständig aus, und je größer der Frame, desto größer der verbleibende, nicht ausgefüllte Bereich. Soweit also keine gute Idee.
Wenn ich 100% für Höhe und Breite nehme, dann gibt es 2 miese Scrollbalken.
Das ist ganz klar - denn zu den 100% addiert sich jeweils noch die Breite des Rahmens, dadurch wird das body-Element inklusive border größer als 100%. Davon ausgehend ist es unmöglich, das body-Element dazu zu bringen, die Breite und Höhe des Elternelements zu übernehmen (100%) und gleichzeitg a) padding zu verwenden und b) border zu verwenden.
Folglich sollte gar nicht versucht werden, alles zu vereinigen. So wird der Rahmen zunächst dem html-Element zugewiesen, welches das Fenster immer komplett ausfüllt (meines Wissens), dadurch ist gesichert, dass er an die Ränder grenzt. Auch die Hintergrundfarbe wird über das äußerste Element definiert. Darin befindet sich nun das body-Element, welches sein Elternelement gar nicht mehr ausfüllen muss und deshalb width und height überflüssig werden - es ist einfach dort zuende, wo sein Inhalt zuende ist. Mit margin oder padding (es dürfte gleichgültig sein) wird as body-Element nun vom Elternelement durch Abstände abgesetzt. Heraus kommt:
html {margin:0; padding:0; border:4px ridge white; background-color:#6699ff;}
body {margin:20px; padding:0;}
Das klingt soweit logisch und funktioniert auch im Mozilla und Opera 7, aber Opera 6.05 will eine height-Angabe für html (Obwohl die Hintergrundfarbe das komplette Dokument ausfüllt, wird der Rahmen nur um das body-Element gezeichnet, damit kommt man wieder in den Teufelskreis, dass 100%-8px nicht berechenbar ist) und MSIE 6 schneidet den Rahmen rechts ab, ihm gefällt die obige Variante besser.
Wahrscheinlich ließen sich Styles durch verschieden Styles für verschiedene Browser vereinbaren, sodass jeder Browser zufriedengestellt ist. Zum Einstieg:
http://w3development.de/css/hide_css_from_browsers/summary/
http://centricle.com/ref/css/filters/
Sofern ich es aus dem Kopf auf die Reihe bekomme, könnte es für das body-Element und Elemente darunter (weitere Selektoren sind möglich) folgendermaßen aussehen:
body {/* Styles für alle folgenden und vor allem MSIE (Windows) */}
html>body {/* Styles für alle folgenden und vor allem Opera 6.x */}
head:first-child+body {/* Styles für alle folgenden und vor allem Opera 7.x (Orlando weiß so etwas ;)) */}
html:root body {/* Styles speziell für Gecko-Browser */}
Unterscheidungsmerkmale wären zudem noch spezielle CSS2- und/oder CSS3-Attributselektoren... Aber wie es für das html-Element laufen soll, ist mir schleierhaft. Willkommen in der wunderbaren Welt der Broserbugs und CSS-Hacks, die jedes menschliche Vorstellungsvermögen übersteigen.
Eine weitere Möglichkeit wäre die Verwendung von ausschließlich html,body {margin:0; padding:0; height:100%;} und einer Tabelle, welche den Rest regelt:
<table border="0" cellspacing="0"; cellpadding="10" style="border:3px ridge white; background-color:#6699ff; height:100%; width:100%;">
<tr>
<td style="vertical-align:top">...Inhalt...</td>
</tr>
</table>
(Styles können/sollten global ausgelagert werden.) Dabei werden nur im Opera 6.05 Scrollbars angezeigt, im MSIE 6, Mozilla 1.2 und Opera 7.01 ist es okay.
Und damit gehen mir die Ideen aus, und eine Einheitslösung wurde nicht gefunden. Vielleicht kannst du etwas daraus machen. Die Krönung wäre übrigens, alles mit einem vollen DOCTYPE auzuprobieren, sodass die Browser in den standardkonformen Rendermodus schalten, wodurch die Anzeige noch einmal völlig anders ist... ...
Grüße,
Mathias