Menü positionieren
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
auswirkung
basis
code
dank
darstellung
datei
einstellen
entsprechen
ergebnis
freund
genannten fehler
image
klammern
korrigieren
logik
position
quellcode
testen
url
vorstellung
-
hallo ich arbeite gerade an meiner ersten website
http://computercomputer.lima-city.de/index.html
ich habe mir auf einer internetseite ein menü erstellt,dieses soll aber nicht links oben in der ecke sein sondern rechts in dem halbtransparenten kasten.
wie mache ich das? ich hoffe ihr könnt mir helfen vielen dank
Beitrag zuletzt geändert: 19.5.2009 9:50:39 von computercomputer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
#background { background-image:url(images/img01.jpg); background-repeat:no-repeat; background-position: center center; background-color:0d0d0f; height:768px;
^^ sehr große datei -
1. Dein Style-Bereich ist viel groesser.
2. Fuege bei #MainMenu einfach zwischen den klammern noch
ein. Neben right: kannst du den Pixelabstand zum rechten Rand einstellen.position:absolute;right:10px;
telelo
Edit: Falls du noch mal solche Probleme hast, www.css4you.de.
Beitrag zuletzt geändert: 19.5.2009 11:17:11 von telelo -
#MainMenu { width:150px; background:#FFF url(images/bmid_110.gif); border:0; margin:0; position:absolute;right:10px; }
so sieht das jetzt bei mir aus doch das menü klebt immer noch links oben
@dcot<style> #MainMenu { width:150px; background:#FFF url(images/bmid_110.gif); border:0; margin:0; } #tab { top:0; height:0; margin:0; } #tab ul { list-style:none; float:left; margin:0; padding:0; } #tab li { float:left; clear:both; margin:0; padding:0; } #tab a { background:url(images/bright_110.gif) no-repeat right top; text-decoration:none; width:180px; border:0; display:block; float:left; margin:0; padding:0; } #tab a span { display:block; background:url(images/bleft_110.gif) no-repeat left top; font-family:\"Trebuchet MS\", Arial, Helvetica, sans-serif; font-size:13px; color:#FFF; font-weight:700; line-height:33px; padding:0 25px; } #tab a:hover,#tab li.item_active a { background-position:right bottom; } #tab a:hover span,#tab li.item_active a span { background-position:left bottom; color:#FFF; font-weight:700; font-style:normal; text-decoration:none; } .dropmenudiv { position:absolute; top:0; float:left; display:block; visibility:hidden; border:0; background:#FFF url(images/bmid_110.gif); color:#FFF; z-index:100; text-decoration:none; padding:0; } .dropmenudiv ul { list-style:none; margin:0; padding:0; } .dropmenudiv li { display:inline; margin:0; padding:0; } .dropmenudiv a:link,.dropmenudiv a:visited { width:180px; display:block; border:0; color:#FFF; background:url(images/bleft_110.gif) no-repeat left top; font-weight:700; font-style:normal; text-decoration:none; margin:0; padding:0; } .dropmenudiv a span { display:block; line-height:33px; background:url(images/bright_110.gif) no-repeat right top; font-family:\"Trebuchet MS\", Arial, Helvetica, sans-serif; font-size:13px; color:#FFF; float:none; padding:0 25px; } .dropmenudiv a:hover { border:0; background-position:left bottom; font-weight:700; font-style:normal; text-decoration:none; color:#FFF; } .dropmenudiv a:hover span { background-position:right bottom; color:#FFF; font-weight:700; } </style>
hättest doch auch in quellcode gucken können? -
Versuch das gleiche mal bei #tab.
telelo
Und schreibe statt <style> mal <style typ="text/css">
Beitrag zuletzt geändert: 19.5.2009 11:35:52 von telelo -
Damit überhaupt etwas vernünftig funktionieren kann, mußt Du zuerst die Fehler in der HTML-Struktur beseitigen. Im jetzigen Zustand sind Ergebnisse nicht unbedingt vorhersehbar und jeder Browser versucht nach eigenen Reglen ein funktionierendes Dokument zu generieren..
1. Fehler:
<style type="text/css">
die Zeile ist dort überflüssig
2. Fehler
<style>
ersetzen durch
<style type="text/css">
3. Fehler:
</style> </style>
ersetzen durch
</style>
4. Fehler:
<div align="center"> <div id="background">
Wo werden die beiden Divs wieder geschlossen?
Danach können wir weiterschauen. ;)
-
danke dir, es klappt jetzt
und mir gehts es nicht darum dass die seite berühmt wird und ich bin ja erst anfänger
und freunde werden sicher nicht rummeckern"bäh, du hast ein div nicht geschlossen"
oder haben die genannten fehler auch auswirkung auf die darstellung? -
computercomputer schrieb:
[...] freunde werden sicher nicht rummeckern"bäh, du hast ein div nicht geschlossen"
oder haben die genannten fehler auch auswirkung auf die darstellung?
Gute Freunde WERDEN meckern, WEIL es Auswirkungen hat...
LG
Webdesignerin
-
Natürlich hat es eine Auswirkung auf die Darstellung, wenn Tags nicht geschlossen werden.
In deinem Fall hat der Browser keine Möglichkeit zu erkennen, ob du die DIV-Blöcke verschachteln, oder nacheinander anordnen wolltest.. Also versucht er selbständig eine Logik hineinzubringen, die aber nicht unbedingt deinen Vorstellungen entsprechen muß.
Ergebnis ist dann eine Frage wie: "Warum sieht meine Webseite nicht so aus, wie ich es möchte."
Valides, also korrekt geschriebenes HTML ist keine Ideologie, sondern Basis für eine vernünftige/berechendare Funktion.
Außerdem erleichtert es die Fehlersuche.
-
telelo schrieb:
Ich sag es jetzt zum zweiten mal:
Warum? War doch bereits beim ersten Mal verständlich. ;) -
Jip aber ihr habt euch drum gehauen wie das nun ist mit dem validierten html code(oder so aehnlich) ausserdem kann man mit diesen riesigen logos auf der homepage zeigen, das man fehlerfrei programmiert hat.
telelo
-
Ok danke
ich werde mal meine hp überprüfen und korrigieren
edit: ich merke gerade das bei telelos lösung es bei anderen auflösungen verrutscht. wie kann ich das verhindern?
edit2: ich habe es jetzt in einen iframe getan und es klappt
Beitrag zuletzt geändert: 20.5.2009 15:41:04 von computercomputer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
