AW: CSS-Navigation
Hallo,
wäre echt um Hilfe dankbar.
Gruss Simon
Ankündigung
Einklappen
Keine Ankündigung bisher.
CSS-Navigation
Einklappen
X
-
AW: CSS-Navigation
Hallo,
kann mir keiner helfen, wie ich das mit den Linien beheben kann?
Gruss Simon
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hallo,
ja das werde ich heute Abend mal ausprobieren. Aber in Sachen fehlende Linien bin ich immer noch nicht weiter.
Gruss Simon
Edit (autom. Beitragszusammenführung):
Das mit dem Abstand passt jetzt, aber ich verzweifle an den teilweise nicht vorhanden Linien! Woran liegt das nur?
Gruss SimonZuletzt geändert von sb-canerods; 22.10.2007, 18:02. Grund: Antwort auf eigenen Beitrag innerhalb von 24 Stunden!
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hi,
dass wenn man auf die links mit den Unterlinks geht, diese fast nicht anklickbar sind? Kein Ahnung warum!
Da sind kleine Zwischenräume vorhanden, die die Unterpunkte dann wieder verschwinden lassen, wenn der Mauszeiger auf so einen "Leerraum" zeigt.
Also mit den Abständen spielen. Tipp: Man kann das mit den Abständen/Größen der ul, der Listenpunkte oder auch mit den Links beheben.
Peter
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Ja, aber das menu bezieht sich doch nur auf die Navigation nicht auf den Rest. Hab´s jetzt trotzdem mal auf #000000 gestzt, jetzt sind die Kästchen halt mit einem Strich getrennt.
Das müsste also in der Start.css stehen und hier ist denke ich alles in Ordnung !??
Gruss Simon
Edit (autom. Beitragszusammenführung):
Ich komm einfach nicht drauf, wie man die Linien wieder hinbekommt!
Desweiteren, habe ich mir das Ganze mal auf einem anderen Rechner angeschaut und festgestellt, dass wenn man auf die links mit den Unterlinks geht, diese fast nicht anklickbar sind? Kein Ahnung warum!
Gruss
SimonZuletzt geändert von sb-canerods; 22.10.2007, 09:11. Grund: Antwort auf eigenen Beitrag innerhalb von 24 Stunden!
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Du hast aber auch fuer border-color vier Werte eingegeben, bei "#menu a, #menu h2" (#ccc #888 #555 #bbb), anstatt nur einer Farbe.
Soweit ich weiss, gibt man nur eine Farbe an! Du musst aufpassen, dass du moeglichst W3C-konform schreibst, dann bist du eigentlich meist auf der sicheren Seite.
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Ja klar, danke dir. Aber warum sind teilweise die schwarzen Rahmenlinien weg. 1px solid black ist doch korrekt und die Seitenangaben auch!?
Gruß Simon
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hmm.
Das kommt alles davon, dass du in deiner menu.css die Farbe manchmal nicht mit einem Rautezeichen davor eingibst. Das funktionier aber nicht mit css. Wenn du statt zB 666666 #666666 schreibst, dann sieht man auch Farbe
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hi Koesmi,
hab die Breite jetzt auf 120 gesetzt, das funktioniert einwandfrei!
Den Doctype habe ich auch geändert, jetzt sind ganzen Farben weg!!
http://www.sb-canerods.de/Seite1.1.htm
Gruss Simon
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hallo Simon,
Erstmal wuerde ich sagen, solltest du unbedingt einen Link zu einer gueltigen Transitional-DTD in deinen DOCTYPE-Tag schreiben, denn sonst ist der IE naemlich ganz verwirrt und weiss vor Aufregung gar nicht was er tun soll
Also beispielsweise
HTML-Code:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html401/loose.dtd">
Dann noch wolltest du, dass die Menues nicht ueberlappen:
Du hast in der menu.css angegeben, dass die Elemente "#menu ul" eine feste Breite von 80px haben sollen.
Das reicht denen wohl nicht aus.
Es gibt zwei Moeglichkeiten; Entweder du setzt die position auf relative bei dem Element, dann richtet sich die Breite der Menuepunkte nach der Laenge ihrer Bezeichnungen (Folge - Keine Ueberlappung moglich);
oder aber du setzt die Breite einfach auf mehr als 80px (zB 150px), dann ist aber jeder Punkt breiter.
Oder aber du verkuerzt deine namen.
Was das Aussehen von Opera und Firefox angeht, ich glaube sofern du dann noch W3C-Konform arbeitest, und keine sonderlichen Tags benutzt, (also solche, die der IE nicht versteht), dann wird die Page in jedem Browser gleich aussehen.
Falls du doch irgendetwas bestimmtes findest, worin sie sich unterscheiden, dann poste!
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hi Koesmi,
ich hab es jetzt auf deine Art gemacht, das funktioniert jetzt wenigstens bei mir. Nur im Opera und Firefox überlappt sich der link "Schnurverbindung" und "Stammtisch", kann man das ändern?
Desweiteren sieht die ganze Darstellung der Navigation im IE, Firefox und Opera unterschiedlich aus, wie kann man das vereinheitlichen, dass das Ganze nach was aussieht? Danke und Gruss
Simon
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hey Simon,
1) Du hast in deiner menu.css jetzt einen Script drin, der fuer das Aufklappen der Menues im IE zustaendig sein soll.
Im menu.css wird er aber ja nicht ausgefuerht, das ist eine Stylesheet-Datei.
Also musst du diesen ganzen Script entweder in deine Seite1.1.htm-Datei kopieren, oder aber in eine seperate Script-Datei legen (.js), die du dann mit dem SCRIPT-Tag einbindest.
2)Du willst doch, dass dein Menue aus "Seite3a", "Seite3b" und "Seite3c" als Untermenue von "Bilder" aufklappt, oder?
Dann musst du aber, sofern du deine Stylesheet-Datei nicht veraendern willst, das gesammte Untermenue (von UL bis zu /UL) in die Bilder LI kopieren:
Statt:
HTML-Code:<li><a href="#Beispiel">Bilder</a></li> <ul> <li><a href="#Beispiel">Seite 3a</a></li> <li><a href="#Beispiel">Seite 3b</a></li> <li><a href="#Beispiel">Seite 3c</a></li> </ul>
HTML-Code:<li><a href="#Beispiel">Bilder</a> <ul> <li><a href="#Beispiel">Seite 3a</a></li> <li><a href="#Beispiel">Seite 3b</a></li> <li><a href="#Beispiel">Seite 3c</a></li> </ul> </li>
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Zitat von Peter0308 Beitrag anzeigenHi,
Edit:
@Simon:
Ich empfehle dir, wenn du solche Probleme mit dem derzeitigen Menü hast, das von Ingo 1:1 zu Übernehmen und nur an deine Seite anzupassen.
habe das Menü von Ingo übernommen und angepasst, jetzt sieht es total kaputt aus! Siehe http://www.sb-canerods.de/Seite1.1.htm
Gruss SImon
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hi,
@Koesmi:
Der Listenaufbau von Simon ist absolut korrekt. Es ist Unsinnig, für einzelne Listenpunkte eine komplett neue Liste zu erzeugen.
Peter
Edit:
@Simon:
Ich empfehle dir, wenn du solche Probleme mit dem derzeitigen Menü hast, das von Ingo 1:1 zu Übernehmen und nur an deine Seite anzupassen.
Einen Kommentar schreiben:
-
AW: CSS-Navigation
Hi Simon,
Wenn du die ganzen Listen nebeneinander haben willst, willst du ja wie es aussieht, dann musst du auch jedes Element als Liste definieren. Deine Menuepunkte wie "Ueber mich", "Routenbau" sind nur Listenpunkte.
Ausserdem hast du die DOCTYPE nicht korrekt angegeben, ohne der Dokumentenbeschreibungsdatei reagiert der IE nicht auf hover-Aktionen.
Und wenn du nebeneinanderstehende Menuepunkte haben willst, dann solltest du auch das was ich dir anfangs vorgeschlagen habe lieber rueckgaengig machen.
So sollte dein Code dann ca. aussehen
Fuer Seite1.1.htm
HTML-Code:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><!--Hier die Addresse angeben fuer die DTD--> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Simon Bauer_Feinste gespliesste Fliegenruten</title> <link rel="stylesheet" type="text/css" href="Start.css"> <link rel="stylesheet" type="text/css" href="index.htm"> <link rel="stylesheet" type="text/css" href="menu.css"> <!--[if IE]> <style type="text/css" media="screen"> #menu ul li {float: left; width: 100%;} </style> <![endif]--> <!--[if lt IE 7]> <style type="text/css" media="screen"> body {behavior: url(csshover.htc); font-size: 100%;} #menu ul li a {height: 1%;} } </style> <![endif]--> </head> <body> <div id="container"> <div id="banner" ><p> <img border="0" src="simon/Logo_rgb_highres12.JPG" width="211" height="160"></p> </div><!-- end banner --> <div id="mainnavi" > <p align="left"><font style="font-size: 1em"> <div id="menu"> <UL><li><h2>Über mich</h2></li></UL> <UL><li><h2>Rutenbau</h2></li></UL> <UL><li><h2>Scnurverbindung</h2></li></UL> <UL><li><h2>Bilder</h2> <ul> <li><a href="#">eins</a></li> <li><a href="#">zwei ...</a> <ul> <li><a href="#">zwei a</a></li> <li><a href="#">zwei b</a></li> <li><a href="#">zwei c</a></li> <li><a href="#">zwei d</a></li> </ul> </li> <li><a href="#">drei ...</a> <ul> <li><a href="#">drei a</a></li> <li><a href="#">drei b ...</a> <ul> <li><a href="#">drei b i</a></li> <li><a href="#">drei b ii</a></li> <li><a href="#">drei b iii</a></li> </ul> </li> <li><a href="#">drei c</a></li> </ul> </li> </ul> </li> </UL> <UL><li><h2>Stammtisch</h2></li></UL> <UL> <li><h2>Onlineshop</h2> <ul> <li><a href="#">eins</a></li> <li><a href="#">zwei ...</a> <ul> <li><a href="#">zwei a</a></li> <li><a href="#">zwei b</a></li> <li><a href="#">zwei c</a></li> <li><a href="#">zwei d</a></li> </ul> </li> <li><a href="#">drei ...</a> <ul> <li><a href="#">drei a</a></li> <li><a href="#">drei b ...</a> <ul> <li><a href="#">drei b i</a></li> <li><a href="#">drei b ii</a></li> <li><a href="#">drei b iii</a></li> </ul> </li> <li><a href="#">drei c</a></li> </ul> </li> </ul> </li> </UL> </div> </div><!-- end mainnavi --> <div id="left"> <ul class="borderbottom"> <li></li> </ul> <p> </p> <ul class="borderbottom"> <li> <font color="#000000"> <span style="font-size: 0.8em">Onlineshop</span></font></li> <li><font color="#000000"><span style="font-size: 0.8em"> Garantie</span></font></li> <li><font color="#000000"><span style="font-size: 0.8em"> Rutenbaukurs</span></font></li> </ul> <p> </p> <p> <script language="JavaScript" type="text/javascript" src="http://www.wetter.com/v2/woys2/woys2.js.php?168230,1b9bed6112977e9f31db92a3273ef528"></script></p> <p> </p> <p> </p> <p><img border="0" src="deutschland.gif" width="32" height="20"> <img border="0" src="greatbritan.gif" width="32" height="20"> </p> </div> <!-- end menu left --> <div id="content"> <p> </p> <p> </p> <p> </p> <p> </p> <p align="center"> <img border="0" src="simon/bambus.jpg" width="119" height="296"></p> <p> </p> <p> </p> <p>«-- <a href="javascript:history.back()"><font color="#000000">zurück</font></a></p> </div> <div id="footer"><h2><span style="font-size: 0.6em"> </span><font style="font-size: 0.6em"> Impressum Kontakt Links Gästebuch</font></h2></div> </div> </body> </html>
Code:#menu { width: 100%; background: #eee; float: left; } #menu ul { list-style: none; margin: 0; padding: 0; width: 80px; float: left; } #menu a, #menu h2 { font: bold 11px/16px arial, helvetica, sans-serif; display: block; border-width: 1px; border-style: solid; border-color: #ccc #888 #555 #bbb; margin: 0; padding: 2px 3px; } #menu h2 { color: #FF8635; background: 666666; text-transform: uppercase; } #menu a { color: #000; background: #efefef; text-decoration: none; } #menu a:hover { color: #a00; background: #fff; } #menu li {position: relative;} #menu ul ul { position: absolute; z-index: 500; } #menu ul ul ul { position: absolute; top: 0; left: 100%; } div#menu ul li:hover ul ul, div#menu ul ul, div#menu ul ul li:hover ul ul {display: none;} div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul {display: block;}
Einen Kommentar schreiben:
homepage-forum.de - Hilfe für Webmaster! Statistiken
Einklappen
Themen: 57.202
Beiträge: 432.324
Mitglieder: 29.596
Aktive Mitglieder: 49
Willkommen an unser neuestes Mitglied, BillyTig.
Online-Benutzer
Einklappen
699 Benutzer sind jetzt online. Registrierte Benutzer: 3, Gäste: 696.
Mit 4.707 Benutzern waren am 12.01.2023 um 03:07 die meisten Benutzer gleichzeitig online.
Die neuesten Themen
Einklappen
-
Try Bard and share your feedback Mar 21, 2023 - so der Aufruf vor wenigen Stunden.
und weiter: We’re starting to open access to Bard, an early experiment that lets you collaborate with generative AI. We're beginning with the U.S. and the U.K., and will expand to more countries and languages...-
Kanal: 2.6 - Smalltalk
Gestern, 23:20 -
-
Hallo,
ich bin neu hier und Webseiten-Anfänger. Trotzdem möchte ich in einem HR-Tag mit Css ein Bild anzeigen, dass nur horizontal über die gesamte Seite wiederholt wird.
HTML-Code:<!--<div id="bild2"> <img src="..\Bilder\TrennungTranparentQuer.jpeg">
Gestern, 15:44 -
Hi liebe Homepage-Foren-Feunde,
hier ein kurzer Hinweis auf das CloudFest 2023
wie immer gibts eine Fülle von Angeboten am Fest. Da ist ganz ganz viel dabei!
...unter anderem auch mit innovativen WordPress-Projekten: VS Code-Erweiterung für In-Browser-Entwicklung...-
Kanal: 2.6 - Smalltalk
21.03.2023, 12:41 -
-
Ich würde mich über eure Meinung zu dem folgenden Szenario freuen:
Ich möchte ein Formular einrichten, das im Wesentlichen die folgenden Schritte triggert:
- Ein PHP-Skript ausführen
- Formulardaten in die WordPress-Datenbank meiner Website speichern
- KEINE anderen...21.03.2023, 07:20 -
Ein freundliches Hallo an alle,
Ich würde gerne von meinem Verein die Pflege der Website übernehmen da es auch einige Vorteile als aktives Mitglied hat. Das Problem ist nur das ich überhaupt keine Ahnung davon habe.
Daher hier meine Frage:
Wie funktioniert sowas und was muss ich...-
Kanal: 1.1 - Einsteiger
18.03.2023, 16:48 -
Die neuesten Beiträge
Einklappen
-
Try Bard and share your feedback Mar 21, 2023 - so der Aufruf vor wenigen Stunden.
und weiter: We’re starting to open access to Bard, an early experiment that lets you collaborate with generative AI. We're beginning with the U.S. and the U.K., and will expand to more countries and languages...-
Kanal: 2.6 - Smalltalk
Gestern, 23:20 -
-
Na schön dann können sich die Internatuten daran vergnügen die Voraussehende Software zu nutzen, wobei man sieht dass keiner der beiden Firmen seine Schöpfung KI nennt.
-
Kanal: 2.6 - Smalltalk
Heute, 15:39 -
-
Hallo,
ich bin neu hier und Webseiten-Anfänger. Trotzdem möchte ich in einem HR-Tag mit Css ein Bild anzeigen, dass nur horizontal über die gesamte Seite wiederholt wird.
HTML-Code:<!--<div id="bild2"> <img src="..\Bilder\TrennungTranparentQuer.jpeg">
Gestern, 15:44 -
Das liegt daran, dass Du einige Syntaxfehler in deinem CSS hast. Ich nutze ebenfalls VS-Code und der zeigt den Code so an:
Dieses funktioniert jedoch einwandfrei:
Code:<style> hr { background: url("images/busleft.png");
Heute, 14:25 -
Hallo,
habe eine Nacht darüber geschlafen und dann doch noch eine Lösung gefunden.
In HTML habe ich diese Anweisung stehen:
HTML-Code:<hr style="background-image:url(TrennungTranparentQuer.png)">
Heute, 12:25 -
Schon lustig. Die gleichen Antworten hier wie im anderem Forum...Gestern, 18:21
-
Ok, dass war mir nicht bewusst. Entschuldigung.
Aber Danke, dass Du mir das mitgeteilt hast. Ist mir bisher noch nie passiert.
Gruß
daggelGestern, 16:07 -
Crossposting bedeutet, dass ein und dieselbe Frage in mehreren Foren oder Newsgroups gleichzeitig gestellt wird. Ein solches Verhalten wird von den meisten Helfern nicht toleriert, denn damit stellst Du einerseits die Kompetenz der Helfer jedes einzelnen Forums und Newsgroup in Frage und bewirkst zudem,...Gestern, 15:58
-
Hallo bdt600,
Warum bist Du sauer? Keine Ahnung, aber gehören die Foren zusammen? ??????????Gestern, 15:53 -
Crossposting: https://www.html-forum.de/threads/10812/#post-13700Gestern, 15:49
Einen Kommentar schreiben: