Frage von Critler, 25

Tabellen & Auflistungen unabhängig vom CSS Dokument erstellen in HTML?

Hallo, ich arbeite gerade an einer website für ein Schulprojekt, hab mir jetzt mit CSS ein Dropdownmenü gemacht, bei dem man natürlich auch die Listen und Aufzählungen vorformatieren muss. Jetzt allerdings, wenn ich eine weitere Liste/Aufzählung/Tabelle im Dokument machen will, kann ich sie nicht formatieren. Ich kann sie nicht zentrieren, sie besitzt keine Aufzählungszeichen (Hab ich im CSS Dokument deaktiviert für das Menü) und lässt sich einfach allgemein nicht mehr bearbeiten... Das ist ein Problem, denn ich brauche Listen sowie Tabellen darin. Wie schaffe ich das jetzt, dass ich das trotzdem hinbekomme, obwohl ich es im CSS Dokument so festgelegt hab? Gibt es eine Art und Weiße wie ich das CSS Dokument nur auf die Stelle des Dropdownmenü's anwende? Hier der Code für das Dropdown:

und hier das CSS Dokument:

  • { margin: 0; padding: 0; font-family: 'Constantia', sans-serif; box-sizing: border-box; }

nav { float: left; width: 100%; opacity: 0.8;
background:#0000; font-size: 32px; }

nav ul { margin: 0; padding: 0; }

nav a { display: block; color:#FFFFFF; text-decoration: none; }

nav ul li { position: relative; float: left; list-style: none; color:#333; transition: 0.5s; }

nav ul li a { padding: 20px; }

nav ul > li.submenu > a:after { position: relative; float: right; content: ''; margin-left: 10px; margin-top: 5px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #fff; border-bottom: 5px solid transparent; }

nav ul ul li.submenu > a:after { margin-left: auto; margin-right: -10px; border-left: 5px solid #fff; border-right: 5px solid transparent; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }

nav ul li:hover { background:; }

nav ul ul { position: absolute; top: -9999px; left: -9999px; background:#000; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); z-index: 1; }

nav ul ul li { float: none; width: 400px; border-bottom: 1px solid #555; }

nav ul ul li a { padding: 10px 20px; }

nav ul ul li:last-child { border-bottom: none; }

nav ul li:hover > ul { top: 100%; left: 0; }

nav ul ul li:hover > ul

Antwort
von userfromberlin, 25

Anstatt bei im CSS document 

nav{}

zu verwenden, solltest Du dem Drop-Down eine Klasse zuweisen 

<nav class="dropdown"></nav>

und diese im CSS-Dokument mittels

.dropdown {}

ansteuern.

Kommentar von Critler ,

Danke erstmal für die äußerst schnelle Antwort. Wenn ich das jetzt richtig verstanden habe, soll ich jedes "nav" im CSS-Dokument durch ".dropdown" ersetzen und dann die Klasse im HTML-Dokument ansprechen. Korrigier mich, wenn ich mich irre.

Hab ich jetzt gemacht, die Tabelle allerdings lässt sich immer noch nicht zentrieren, also habe ich noch irgendwo einen Fehler... Ich werd verrückt

Kommentar von userfromberlin ,

Und wie versuchst Du das Zentrieren? Dein Code oben ist von GF falsch formatiert.

Kommentar von RakonDark ,

nehm mal https://jsfiddle.net/ und kopier das da rein .

Kommentar von Critler ,

Rakon: Das kann ich machen, wenn ich daheim bin:)

Kommentar von Critler ,

Mit table align=" center " ohne Leerzeichen natürlich

Kommentar von userfromberlin ,

hatte ich schon vermutet. damit wird der Inhalt der Tabelle zentriert, nicht aber diese!

Kommentar von userfromberlin ,
Kommentar von Critler ,

Hab ich ausprobiert, jetzt wird mir nicht einmal mehr das Hintergrundbild angezeigt und die Tabelle bewegt sich keinen Millimeter.. ich weiß es nicht, was da falsch dran ist, ich kopier das jetzt einfach mal rein, vllt findet ihr was.

https://jsfiddle.net/g96ka8a4/

auf der Seite funktioniert es, in meinem HTML-Dokument allerdings nicht.. ich verstehs nicht.

Kommentar von userfromberlin ,

Solange es auf der Seite funktioniert, kann ich Dir den Fehler in Deinem HTML-Doc nicht benennen. Allerdings verwendest Du sehr viele veraltete Elemente und Attribute, die in HTML5 nicht mehr erlaubt sind. So etwa: tablespacing, tablepadding, font. Kann sein, dass die nicht mehr ganz sauber interpretiert werden. Ansonsten wie gesagt: Solange es im Demo läuft, ist der Fehler im Original nicht zu finden.

Kommentar von Critler ,

Ich benutze Phase 5 und die Commands davon, habs jetzt mit den "neueren" Commands versucht, aber es klappt immer noch nicht... Ich werd noch verrückt mit dem Zeug.. Ansonsten werd ich mir einfach noch ein CSS Dokument für die Tabelle machen, wenns nicht anders klappt..

Danke für eure zahlreichen Antworten!! Sehr nett!

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten