nicht angemeldet
width:100% und Netscape 4.7 :(
Hallöchen:
ich möchte einen leeren div mit width:100% spannen. Der IE6 versteht's einigermaßen, aber beim NS4.7 sehe ich nur einen mini-kleien Spalt (habe aus Spaß ein eingefügt). Wieso zeigt der doofe Netscape nicht den div über die gesamte Browserbreite???
Hier mal der Quelltext (nicht am Javascript stören, bitte):
//format.css:
body {
background-color:#004F35;
}
.yellowDiv {
position:absolute;
background-color:#CCAE2E;
top:0px;
width:100%;
min-width:100%;
max-width:100%;
height:304px;
}
//index.htm:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>index.htm</title>
<link rel="stylesheet" href="format.css" type="text/css" />
<script type="text/javascript">
<!--
// simple browser-check:
var ns4 = (document.layers);
var ie4 = (document.all && !document.getElementById);
var ie5 = (document.all && document.getElementById);
var ns6 = (!document.all && document.getElementById);
var yellowHeight = 304;
function getClientWidth(){
if (window.innerWidth)
return window.innerWidth;
else if (document.body && document.body.offsetWidth)
return document.body.offsetWidth;
}
function getClientHeight(){
if (window.innerHeight)
return window.innerHeight;
else if (document.body && document.body.offsetHeight)
return document.body.offsetHeight;
}
function init(){
clWidth = getClientWidth();
clHeight = getClientHeight();
yellowTop = (clHeight / 2) - (yellowHeight / 2);
if(ns4)
document.layers["yellowDiv"].top = yellowTop;
else if(ie4)
document.all["yellowDiv"].style.pixelTop = yellowTop;
else if(ie5 || ns6)
document.getElementById("yellowDiv").style.top = yellowTop;// document.all["yellowDiv"].style.pixelTop = yellowTop;
}
//-->
</script>
</head>
<body onLoad="init()">
<div class="yellowDiv" id="yellowDiv"> </div>
kann mir da jemand weiterhelfen??
-
Hallo Felix,
ich möchte einen leeren div mit width:100% spannen. Der IE6 versteht's einigermaßen, aber beim NS4.7 sehe ich nur einen mini-kleien Spalt (habe aus Spaß ein eingefügt). Wieso zeigt der doofe Netscape nicht den div über die gesamte Browserbreite???
Weil er zu einer Zeit entwickelt wurde in der CSS gerade im entstehen war.
Hier mal der Quelltext (nicht am Javascript stören, bitte):
Ok dann sag ich nix dazu :)
Das aufspannen eines div im NS4x geht nur über ein paar (teilweise unlogische) tricks.
1. Das div muß mit position:absolute oder relative positioniert sein.
2. Das div muß einen border erhalten (soll keiner sichtbar sein dann border:none)
3. Für die Hintergrundfarbe muß man layer-background-color:xxxxxx verwenden. Das hier muß allerdings vor den anderen Browsern, die es nicht verstehen versteckt werden.Trotzdem versteht NS4x unter width:100% nicht immer das was man möchte.
Und hier das Beispiel wie es in NS4x und (hoffentlich) im Rest der grafischen Browserwelt funktioniert.
//format.css:
body {
background-color:#004F35;
}.yellowDiv {
position:absolute;layer-background-color:#CCAE2E; /* <---das ist NUR für den NS4x*/
border:none;/* <--- das braucht der NS4x sonst spannt er das div nicht auf. Warum: keine Ahnung*/top:0px;
width:100%;
min-width:100%;
max-width:100%;
height:304px;
}@media screen {.yellowDiv {background-color:#CCAE2E;}}/* und hier werden alle anderen Browser bedient*/
kann mir da jemand weiterhelfen??
hoffe das konnte ich
Grüße aus Nürnberg,
HarryS-
Hi,
erstmal vielen Dank, ich kann es zwar momentan nicht ausprobieren, aber ein versteh ich schon mal nicht:
Wie funktioniert das mit dem Verstecken????? Das habe ich noch nie gemacht und ich werd auch nicht so ganz schlau draus. Es lesen doch alle Browser den gleichen Quelltext.
Und du kannst auch gerne was zum JavaScript sagen, wenn wirklch so schlimm ist!
Felix
-
Hallo Felix,
erstmal vielen Dank, ich kann es zwar momentan nicht ausprobieren, aber ein versteh ich schon mal nicht:
Wie funktioniert das mit dem Verstecken????? Das habe ich noch nie gemacht und ich werd auch nicht so ganz schlau draus. Es lesen doch alle Browser den gleichen Quelltext.Naja, das ist eine sogenannte CSS Browserweiche http://aktuell.de.selfhtml.org/tippstricks/css/browserweiche/index.htm
Der Trick ist folgender:
was bei .yellowdiv steht sehen alle Browser, allerdings ignorieren alle außer NSx die Angabe layer-background-color.Aber was bei @media screen steht versteht der NS4x nicht und ignoriert die Angabe. Alle Browser die background-color verstehen kapieren aber dieses @media screen und zeigen an was in {} steht.
Alles klar?Und du kannst auch gerne was zum JavaScript sagen, wenn wirklch so schlimm ist!
Nenenene sooo schlimm ist er nich und ich hab den scriptcode eigentlich auch garnicht angeschaut
Grüße aus Nürnberg,
HarryS
-
-
Hi,
noch eine Frage: Wie erzwinge ich eine Höhe von x Pixeln, ohne, dass ein Inhalt im div ist? Ich sehe jetzt zwar das div so quasi auf 100% width, aber nur eine Zeile, da ich ja ein eingefügt habe??
-
Hi,
noch eine Frage: Wie erzwinge ich eine Höhe von x Pixeln, ohne, dass ein Inhalt im div ist? Ich sehe jetzt zwar das div so quasi auf 100% width, aber nur eine Zeile, da ich ja ein eingefügt habe??
Du kennst das Archive und die Suchfunktion von diesem Forum?
Wenn nicht sei sie dir nahegelegt, weil dein Problem wirklich mehrmals in der Woche hier auftaucht.
und hier hab ich mal was probiert was aber nicht valide ist: http://forum.de.selfhtml.org/archiv/2003/1/36298/
wenn du das height Attribut aus der Tabelle nimmst ist es valide.
Struppi.
-
Hallo Felix,
noch eine Frage: Wie erzwinge ich eine Höhe von x Pixeln, ohne, dass ein Inhalt im div ist? Ich sehe jetzt zwar das div so quasi auf 100% width, aber nur eine Zeile, da ich ja ein eingefügt habe??
Also in meinem NS4.75 (hab leider keine anderen Versionen zum testen) ist das hier auch 304px hoch, naja nicht nachgemessen, aber auf alle Fälle viel höher als eine Zeile.
<html>
<head>
<title>Untitled</title><style type="text/css">
html{height:100%;width:100%}.yellowDiv
{
position:absolute;
layer-background-color:#CCAE2E; /* <---das ist NUR für den NS4x*/
top:0px;
width:100%;
height:304px;
border:none; /* <--- das braucht der NS4x sonst spannt er das div nicht auf. Warum: keine Ahnung*/
}
@media screen {.yellowDiv {background-color:#CCAE2E;}}/* und hier werden alle anderen Browser bedient*/
</style></head>
<body><div class="yellowDiv"></div>
</body>
</html>Falls es bei Dir nicht klappt, poste doch mal den relevanten code und die NS version.
Aaaaaaber jetzt kommt nochwas: Wenn Du jetzt die Fenstergröße des NS4x veränderst ist das gesammte CSS-layout weg. Da bist Du dann Opfer des resize Bugs geworden. Aber auch dafür gibt es ein Kraut: http://www.styleassistant.de/tips/tip35.htm
Grüße aus Nürnberg,
HarryS
-
-