nicht angemeldet
Kann Netscape keine div-Bereiche überlagern?
Guten Morgen!
Ich wollte eigentlich eine Buttongrafik mit einem Text überlagern, um Ladezeit zu sparen und den HTML-Code einfacher erweiterbar zu machen. Folgendes habe ich geschrieben:
#m1 {position:absolute;left:10;top:25;width=126;height=22;z-index:0}
#l1 {position:absolute;left:10;top:26;width=126;height=22;z-index:1}
<div id="m1">
<a href="#"><img src="images/button.gif" width="126" height="22" border="0" alt=""></a>
</div>
<div id="l1" valign="center">
<center>
<font face="arial" size="1" color=#000000><b><a href="links.html" style="text-decoration:none">
Links</a></b></font>
</div>
Im Internetexplorer sieht das nun genauso aus wie ich es mir vorgestellt habe. Der Text befindet sich auf dem Button und man kann den Link benutzen als wäre der Button eine reine Grafik. In Netscape jedoch befinden sich Button und Text untereinander und das mit der Größenangabe und dem Zentrieren klappt auch nicht so recht. Was mache ich falsch?
Für Eure Hilfe wäre ich wirklich dankbar! Ich habe auch schon im Archiv gesucht, aber wenn man nicht genau weiß, welche Begriffe man einzugeben hat, dann ist es auch sehr schwer, genau das zu finden was man sucht.
Grüße
POldi.
-
Hi Poldi,
Du solltest dringend <../../td.htm> lesen!!!!
für's erste:
#m1 {position:absolute;left:10px;top:25px;width:126px;height:22px;z-index:0;}
#l1 {position:absolute;left:10px;top:25px;width:126px;height:22px;z-index:1;}Grüße,
Martin-
Hi!
Danke für den Tip!
Du solltest dringend <../../td.htm> lesen!!!!
Naja, das habe ich gelesen aber natürlich merkt man sich nicht alles gleich und läßt schonmal was weg. Ich habe ja
auch noch genügend andere Literatur, aber ich glaube jeder kennt dieses Problem: Man will etwas machen,
es funktioniert nicht und man weiß eben nicht so recht wo man jetzt genau nachsehen soll.für's erste:
#m1 {position:absolute;left:10px;top:25px;width:126px;height:22px;z-index:0;}
#l1 {position:absolute;left:10px;top:25px;width:126px;height:22px;z-index:1;}Das hat leider nicht den gewünschten Erfolg gebracht. Du hast nur ein "px" an die Werte angefügt, oder habei ch noch
was übersehen? Das habe ich jetzt auch mal probiert, aber Netscape weigert sich nach wie vor, das so darzustellen
wie es das sollte.Muß ich eventuell mit Layern arbeiten? Das wäre mir nämlich garnicht recht denn selbige kann man nur mittels Javascript
positionieren (bitte um Aufklärung, falls das anders geht!) und dann funktioniert die Seite nur bei eingeschaltetem Javascript
und das würde ich gerne vermeiden.Viele Grüße
Poldi.
-
Hi
Nein das Problem war, dass du bei den CSS Angaben nach height und width ein Gleichheitszeichen hattest statt eines Doppelpunktes. Und das fuehrt glaube ich dazu, dass NS die beiden divs gar nicht positioniert, sondern einfach nur untereinander darstellt.
Desweiteren funktioniert bei NS CSS nur bei eingeschaltetem Javascript! Soll heissen: Wenn ich Javascript ausschalte, dann werden die divs untereinander dargestellt. Da kannst du nichts gegen machen.
Tschau Holger-
HI!
Nein das Problem war, dass du bei den CSS Angaben nach height und width ein Gleichheitszeichen hattest statt eines Doppelpunktes. Und das fuehrt glaube ich dazu, dass NS die beiden divs gar nicht positioniert, sondern einfach nur untereinander darstellt.
Desweiteren funktioniert bei NS CSS nur bei eingeschaltetem Javascript! Soll heissen: Wenn ich Javascript ausschalte, dann werden die divs untereinander dargestellt. Da kannst du nichts gegen machen.
Tschau HolgerJa, danke, DAS war ein entscheidender Fehler. Man wird mit der Zeit einfach betriebsblind wenn man sich den ganzen
Tag mit sowas beschäftigt ... danke nochmal!Grüße
Poldi.
-
Hallo Poldi,
Wenn es nur darum geht, einen Link vor einen "Hintergrundbutton" zu bekommen, dann versuch es doch einfach mal mit einer Tabelle mit "background". :-)
Folgendes funktioniert bei mir mit NN4.73 und IE5.5:<table background="button.gif" width="100" border="0" cellpadding="0" cellspacing="0"><tr>
<td height="50" valign="middle" align="center"><a href="javascript:alert('Autsch');">Hit me!</a></td>
</tr></table>Vielleicht funktioniert das besser, zumal es javascriptunabhängig ist.
Gruß AlexBausW
Please visit my SELFvisitingcard @ http://www.atomic-eggs.com/selfspezial/daten/150.html
-
Hi!
Wenn es nur darum geht, einen Link vor einen "Hintergrundbutton" zu bekommen, dann versuch es doch einfach mal mit einer Tabelle mit "background". :-)
Folgendes funktioniert bei mir mit NN4.73 und IE5.5:<table background="button.gif" width="100" border="0" cellpadding="0" cellspacing="0"><tr>
<td height="50" valign="middle" align="center"><a href="javascript:alert('Autsch');">Hit me!</a></td>
</tr></table>Vielleicht funktioniert das besser, zumal es javascriptunabhängig ist.
Ja, diese Idee hatte ich auch schon. Das hat aber den entscheidenden Nachteil, daß man dann NUR auf den Text
klicken kann, nicht aber auf den Button. Wäre aber im Notfall eine eventuelle Alternative für Netscapeuser.Grüße
Poldi.
-
-
-
-
Hi Poldi
folgendes klapp bei mir wunderbar mit Netscape (überlappt):
<html>
<head>
<title>Test</title><style type="text/css">
#m1 {position:absolute;left:10px;top:25px;width:126px;height:22px;border-style:solid;border-width:2px;z-index:0;}
#l1 {position:absolute;left:20px;top:30px;width:126px;height:22px;border-style:solid;border-width:2px;z-index:1;}
</style></head>
<body>
<div id="m1">
<a href="#"><img src="images/button.gif" width="126" height="22" border="0" alt=""></a>
</div>
<div id="l1">
<center>
<font face="arial" size="1" color=#000000><b><a href="links.html" style="text-decoration:none">
Links</a></b></font>
</div>
</body>
</html>Du hast nur ein "px" an die Werte angefügt
Ich habe "nur" Maßeinheiten angegeben (Wie hoch? Meter, Äpfel, Celsius??)
Muß ich eventuell mit Layern arbeiten? Das wäre mir nämlich garnicht recht denn selbige kann man nur mittels Javascript
positionieren (bitte um Aufklärung, falls das anders geht!)Hä?? Du solltest dringend: <../../selfhtml.htm> lesen!
und dann funktioniert die Seite nur bei eingeschaltetem Javascript
und das würde ich gerne vermeiden.Bei Netscape funktionieren Style-Sheets n u r bei eingeschaltetem JavaScript, unabhängig davon, ob Du JavaScript benutzt oder nicht.
Grüße,
Martin-
hi!
folgendes klapp bei mir wunderbar mit Netscape (überlappt):
<html>
<head>
<title>Test</title><style type="text/css">
#m1 {position:absolute;left:10px;top:25px;width:126px;height:22px;border-style:solid;border-width:2px;z-index:0;}
#l1 {position:absolute;left:20px;top:30px;width:126px;height:22px;border-style:solid;border-width:2px;z-index:1;}
</style></head>
<body>
<div id="m1">
<a href="#"><img src="images/button.gif" width="126" height="22" border="0" alt=""></a>
</div>
<div id="l1">
<center>
<font face="arial" size="1" color=#000000><b><a href="links.html" style="text-decoration:none">
Links</a></b></font>
</div>
</body>
</html>Ich habe das nun probiert und es klappt tatsächlich gut. Danke!
Mein blödester Fehler war wohl der mit den "=" Zeichen. Wußte nicht, daß das da nicht geht. Aus Fehlern lernt man eben.Allerdings hat das ein neues Problem aufgeworfen. Zwei oder mehr Buttons untereinander funktionieren wieder nicht. Allerdings hatte ich
sie zuerst in einer Tabelle und das macht Probleme in Netscape wie ich mittlerweile weiß. So habe ich die divs nach der Tabelle definiert
und dann über die Tabelle positioniert. Eventuell sollte ich die Tabelle mal ganz weglassen. Mal sehen ...Du hast nur ein "px" an die Werte angefügt
Ich habe "nur" Maßeinheiten angegeben (Wie hoch? Meter, Äpfel, Celsius??)Naja, es ging auch ohne, zumindest im IE. Wenn Du in einen Laden gehst, der nur Äpfel verkauft, dann reicht es auch wenn Du
sagst "bitte 3 Kilo" :-)Muß ich eventuell mit Layern arbeiten? Das wäre mir nämlich garnicht recht denn selbige kann man nur mittels Javascript
positionieren (bitte um Aufklärung, falls das anders geht!)
Hä?? Du solltest dringend: <../../selfhtml.htm> lesen!Das habe ich. Allerdings nicht 10mal und nicht von Anfang bis zum Ende. "Learning by doing" ist eher meine Devise
und anders geht das wohl auch garnicht. Ich beschäftige mich schon länger mit WebSeitengestaltung, aber noch nicht
sehr lange Mit Stylesheets. Man kann eben nicht alles wissen und oft weiß man nicht wo man nachsehen muß wenn man
plötzlich ein sehr spezielles Problem hat. Ich hoffe, Du verstehst das und hältst mich hier nicht für einen, der
einfach nur zu faul zum Lesen ist.und dann funktioniert die Seite nur bei eingeschaltetem Javascript
und das würde ich gerne vermeiden.
Bei Netscape funktionieren Style-Sheets n u r bei eingeschaltetem JavaScript, unabhängig davon, ob Du JavaScript benutzt oder nicht.Guter Tip. Wußte ich wirklich nicht. Wie schon gesagt ... alles kann man nicht wissen :-)
Muß aber gestehen, daß mich das etwas schockiert hat.Könnte man Netscape nicht irgendwie vom Erdboden verschwinden lassen? :-))
Grüße und Danke
Poldi.
-
Tja, ohne die Tabelle klappts leider auch nicht mit 2 Buttons untereinander :-(
-
Hi Poldi,
...Aus Fehlern lernt man eben.
Und durch Lesen - Autsch, ok ich sage es heute nicht mehr ;-))
und dann über die Tabelle positioniert. Eventuell sollte ich die Tabelle mal ganz weglassen. Mal sehen ...
Erkläre mir doch nochmal bitte, warum Du was mit was überlagern möchtest. Eine Cross-Browser-Lösung sollte kein Problem sein.
Naja, es ging auch ohne, zumindest im IE.
Eben - aber nicht in Netscape!
Wenn Du in einen Laden gehst, der nur Äpfel verkauft, dann reicht es auch wenn Du
sagst "bitte 3 Kilo" :-)
Wenn Deine Seiten nur von IE-Benutzern besucht werden können sollen (was'n Satz), dann kannst Du "px" auch weglassen ;-))
Das habe ich. Allerdings nicht 10mal und nicht von Anfang bis zum Ende. "Learning by doing" ist eher meine Devise
und anders geht das wohl auch garnicht.Jo - war nur nochmal ein "dezenter" Hinweis, s.o..
Könnte man Netscape nicht irgendwie vom Erdboden verschwinden lassen? :-))
Wenn Du AOL kaufts und zusätzlich aller Rechner dieser Erde, stehen die Cahncen nicht schlecht. Aber Halt: Was ist mit all den CDs, Disketten, Streamer-Bändern....
Grüße,
Martin-
Mahlzeit!
...Aus Fehlern lernt man eben.
Und durch Lesen - Autsch, ok ich sage es heute nicht mehr ;-))Puh! Danke ...
und dann über die Tabelle positioniert. Eventuell sollte ich die Tabelle mal ganz weglassen. Mal sehen ...
Erkläre mir doch nochmal bitte, warum Du was mit was überlagern möchtest. Eine Cross-Browser-Lösung sollte kein Problem sein.Ok.
Ich will einen Button (als Grafik, also einfach ein bläuliches Rechteck mit etwas abgerundeten Kanten und ein
wenig Schatten) mit einem Text überlagern, damit das aussieht, als wäre der ganze Button samt Text eine Grafik und
ausserdem hat das den Vorteil, daß man nicht jedesmal einen neuen Button zeichnen muß, wenn ein Menüpunkt dazukommt.Naja, es ging auch ohne, zumindest im IE.
Eben - aber nicht in Netscape!Ging aber (soweit ich mich erinnere) doch auch in NS, allerdings hat wohl das "=" gestört ...
Wenn Du in einen Laden gehst, der nur Äpfel verkauft, dann reicht es auch wenn Du
sagst "bitte 3 Kilo" :-)
Wenn Deine Seiten nur von IE-Benutzern besucht werden können sollen (was'n Satz), dann kannst Du "px" auch weglassen ;-))Na in welcher Einheit sollte man denn eine Höhe sonst noch angeben? In Äpfeln? Die sind doch alle verschieden hoch :-)
Ist dann wie mit Elle oder Fuß ... wer auf großem Fuß lebte hatte früher viel kleinere Grundstücke als die mit kleineren Latschen ...Das habe ich. Allerdings nicht 10mal und nicht von Anfang bis zum Ende. "Learning by doing" ist eher meine Devise
und anders geht das wohl auch garnicht.
Jo - war nur nochmal ein "dezenter" Hinweis, s.o..Jaja, ich hab's schon verstanden :-)
Könnte man Netscape nicht irgendwie vom Erdboden verschwinden lassen? :-))
Wenn Du AOL kaufts und zusätzlich aller Rechner dieser Erde, stehen die Cahncen nicht schlecht. Aber Halt: Was ist mit all den CDs, Disketten, Streamer-Bändern....Nun ja, das scheint mir einfacher, als mit Netscape auf Dauer klarzukommen :-)
Grüße
Poldi.
-
Hi Poldi,
Ich will einen Button (als Grafik, also einfach ein bläuliches Rechteck mit etwas abgerundeten Kanten und ein
wenig Schatten) mit einem Text überlagern, damit das aussieht, als wäre der ganze Button samt Text eine Grafik und
ausserdem hat das den Vorteil, daß man nicht jedesmal einen neuen Button zeichnen muß, wenn ein Menüpunkt dazukommt.wie wäre es damit:
<div id="m1">
<a href="#"><img src="images/button.gif" width="126" height="22" border="0" alt=""></a>
</div>
<div id="l1">
<center>
<font face="arial" size="1" color=#000000><b><a href="test.html" style="text-decoration:none"> Links </a></b></font>
</div>Wenn beide Layer exakt gleichgroß sind funktioniert das einigermaßen. Du kannst statt der Leerzeichen natürlich auch eine transparente Grafik entsprechende Größe links und rechts des Textes positionieren.
Aber Achtung: Perfekt wird es so oder so nie, das IE und NN Schriften unterschiedlich groß ausgeben.Vielleicht gelingt es Dir noch, es zu perfektionieren.
ABER: IMHO ist es einfacher, die Buttons m i t Text zu erstellen. Das ist vom Zeitaufwand nicht unflexibler (man hat einen Masterfile, mit einer Ebene für die Farbe und vielen Ebenen für den jeweiligen Text).
Grüße,
Martin-
Hi!
<div id="m1">
<a href="#"><img src="images/button.gif" width="126" height="22" border="0" alt=""></a>
</div>
<div id="l1">
<center>
<font face="arial" size="1" color=#000000><b><a href="test.html" style="text-decoration:none"> Links </a></b></font>
</div>Wenn beide Layer exakt gleichgroß sind funktioniert das einigermaßen. Du kannst statt der Leerzeichen natürlich auch eine transparente Grafik entsprechende Größe links und rechts des Textes positionieren.
Aber Achtung: Perfekt wird es so oder so nie, das IE und NN Schriften unterschiedlich groß ausgeben.Probier doch mal, zwei solcher Buttons in Netscape UNTEREINANDER zu positionieren. Du wirst überrascht sein :-)
Allerdings kann es auch an einem oder mehrern Bugs in NS4.73 liegen. Einige Seiten haben damit Probleme und
funktionieren unter NS4.75 besser - ja, kaum zu glauben!Vielleicht gelingt es Dir noch, es zu perfektionieren.
Mal sehen ...
ABER: IMHO ist es einfacher, die Buttons m i t Text zu erstellen. Das ist vom Zeitaufwand nicht unflexibler (man hat einen Masterfile, mit einer Ebene für die Farbe und vielen Ebenen für den jeweiligen Text).
Naja, ich wollte halt "besonders trickreich" sein. Abgesehen davon werde ich sowieso bereits serverseitig zwischen verschiedenen Browsertypen unterscheiden. So nach dem motto "NS4","IE4/IE5" und dann noch eine
eher schlichte Seite mit derselben Information jedoch ohne Scripte und so zeugs für alle anderen. Sollte klappen ...Gruß
Poldi.
-
Hi,
Probier doch mal, zwei solcher Buttons in Netscape UNTEREINANDER zu positionieren. Du wirst überrascht sein :-)
Uops! Das war mir neu - Naja, Netscape ist halt eine Fehlgeburt!
Probiere doch einfach, was AlexBausW vorgeschlagen hat.
Ich beende jetzt vom meiner Seite diesen Thread...
Grüße,
Martin -
Hi
Ich wuerde an deiner Stelle lieber den Hintergrund und den Text in ein Bild stecken. (Wie auch Martin schon gesagt hat.)
Das hat den Vorteil, dass du
1. kein Javascript brauchst (wegen des CSS)
2. Dein ganzes Bild anklickbar ist und nicht nur der Textlink, der ja nie genausogross ist, wie das Hintergrundbild.
Ausserdem gibt es einen Grundsatz, den ich immer befolgen wuerde:
Alles, was ohne Javascript (CSS) geht, wuerde ich auch in reinem html machen. Das erspart sehr viel Aerger
Tschau Holger
-
-
-
-
-
-
-
-