nicht angemeldet
Ebenen überlappen sich nicht wie gewollt
Hallo,
ich bin dabei für meine Firma einen kleinen Image-Auftritt zu basteln. Zur Positionierung möchte ich CSS verwenden. Leider komme
ich schlechter damit zurecht als ich dachte.
http://www.dps-wermsdorf.de/home5/index2.htm
Die Box in der "Überschrift" steht wird leider von der oberen Grafik überlappt. Auch z-index-Angaben scheinen nicht weiter zu helfen. Der IE zeigt ein anderes Verhalten. Hier steht die Box im Vordergrund, wie ich es möchte.
Für Tips wie ich das auch in anderen Browsern erreichen kann wäre ich dankbar. Vielleicht habe ich ja auch 10^n andere Fehler in meinen CSS-Angaben. Ich ducke mich schon mal. :-)
MfG
MarkX.
-
http://www.dps-wermsdorf.de/home5/index2.htm
Die Box in der "Überschrift" steht wird leider von der oberen Grafik überlappt. Auch z-index-Angaben scheinen nicht weiter zu helfen. Der IE zeigt ein anderes Verhalten. Hier steht die Box im Vordergrund, wie ich es möchte.
Für Tips wie ich das auch in anderen Browsern erreichen kann wäre ich dankbar. Vielleicht habe ich ja auch 10^n andere Fehler in meinen CSS-Angaben. Ich ducke mich schon mal. :-)ohje.
<html>
DOCTYPE fehlt.
<head>
<style type="text/css">
<!--
.center { text-align:center; }
.Schrift1_head { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; color: #000000; font-weight: bold}
.Schrift1 { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; color: #000000; font-weight: normal}
.copyright { font-family: Arial, Helvetica, sans-serif; font-size: 8pt}
.kursiv { font-family: "Times New Roman", Times, serif; font-size: 24pt; font-style: italic}Ich bezweifle, dass du das wirklich so willst.
CSS dient dazu HTML und Design voneinader zu trennen. Die HMTL tags dienen zum auszeichnen des Dokumentes.d.h. Schrift1 ist ganz einfach das ganze Dokument, also body und Schrift1_head ist wohl eine Überschrift H1, kursiv gibt es schon mit <i>.
Ganz allgemein ist dir zu raten, von dem inline Styles wegzukommen und das CSS vom HTML Code zu trennen.
-->
</style></head>
<body bgcolor="#CCCCCC">
<div style="margin-top: 50px; margin-left:auto; margin-right:auto; height: 650px; width: 900px; background-color: #DDDDDD; border-style: solid; border-color: #000000; border-width: 1px;">Falls das quasi dein "Hauptcontainer" darstellen soll ist das dein Dokument. also
<style....>body
{
margin-top: 50px;
margin-left:auto;
margin-right:auto;
height: 650px;
width: 900px;
background-color: #DDD;
border: solid #0001px
}
</style>wobei ich die Breite nicht angeben würde oder wenn in % bei mir ist ein riesiger Horizontaler Scrollbalken.
<span class="Schrift1_head">Überschrift</span><br>
Eine Überschrift wird mit H1 bis H6 ausgezeichnet.
<span class="Schrift1">
Hier kann der Begrüßungs- und Einführungstext stehen
</span>und ein ansatz Fließtext mit p.
</div>
<div style="margin-top: -63px; margin-left: 588px; height: 100px; width: 300px; background-color: #DDDDDD;" class="kursiv">...
alles unter einem Dach</div>Kursiv mit <i>
<div style="margin-top: 10px; margin-left: 10px; z-index:2;"><img src="grafik1.jpg" width="880" height="216"></div>
<div style="margin-top: 80px; margin-left: 0px; background-color: #DDDDDD; width: 900px; height: 10px; border-style: solid; border-color: #000000; border-top-width: 1px; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; text-align: center;">
<span class="copyright">© 2003 Deutscher Philatelie Servie GmbH,
Bischofsweg 2b, 04779 Wermsdorf, Deutschland, Tel.: 034364 / 804 804, Fax:
034364 / 804 898</span> </div>
</div>DIV's sind Bereiche, die du von anderen Trennen willst und mit span zeichnest du Abschnitte aus, die du mit keinem HTML Tag beschreiben kannst.
ansonsten kann ich zu deinem Problem nichts sagen da mein Browser (IE 4) die Fehler nicht anzeigt.
Struppi.
-
Hallo Struppi,
seufz. Naja, das mit dem DOCTYPE ist klar --> Setzen! Sechs!
Die Funktion von DIVs und SPANs ist mir schon klar. Nur wie ich sie richtig anordne nicht. Was ist empfehlenswert? position: relative, position: absolute oder wie ich es gemacht habe mit margin-top, margin-left,.... ?
Das mit dem body als Container hab ich jetzt gemacht und den vergessenen DOCTYPE habe ich ebenfalls ergänzt. Leider bleibt mein Hauptproblem weiter ungelöst.MfG
MarkX.-
Die Funktion von DIVs und SPANs ist mir schon klar. Nur wie ich sie richtig anordne nicht. Was ist empfehlenswert? position: relative, position: absolute oder wie ich es gemacht habe mit margin-top, margin-left,.... ?
postition absolute würd ich nur verwenden, wenn du wirklich absolut positionieren willst und dir es nicht um Abstände geht.
Wie gesagt ich kann an der Seite dein Problem mit meinen Browsern, die ich hier zu Verfügung hab, nicht nachvollziehen, insofern erschöpft sich meine Hilfsmöglichkeiten auf einige grundlegenden Hinweise.Struppi.
-
-
-
Für Tips wie ich das auch in anderen Browsern erreichen kann wäre ich dankbar. Vielleicht habe ich ja auch 10^n andere Fehler in meinen CSS-Angaben. Ich ducke mich schon mal. :-)
Scheiß die Positionierung mit den margins raus und verwende stattdessen position:absolute.
Siehe auch:
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#z_indexMfG
Klaus