Listen eines Widgets zentriert darstellen

Es wäre einfacher, wenn man das Ergebnis mal sehen könnte.

Aber spontan würde ich folgendes versuchen:

Bei .gw-tags li das float:left raus und stattdessen text-align:center einfügen.

 

Ok, jetzt wo ich es sehe... Ich glaube ich habe dich falsch verstanden.
Ich dachte, du wolltest alle li untereinander (also eins pro Zeile) und diese Zeilen dann zentrieren.

Was meinst du denn genau mit "Inhalt zentriert"?

Möchtest du die Darstellung der einzelnen li genau so erhalten, aber identische Abstände rechts und links zur Sidebar? Oder möchtest du, dass die li zwar nebeneinander sind, aber nicht linksbündig, sondern zentriert (also im Sinne von zentrierten Text)?


Gibt es einen Link zur Seite?

 

Probiers mal so:

Code:

Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!

 

Ja, weil du in deinem unteren CSS-Teil, für die Kategorien, auch noch ein float: left; drin hast.

Gruß
helix

 

Es sollen aber doch zuerst die Kategorien gelistet werden und dann die Tags?
D.h. das Problem ist, dass damit ein Zeilenumbruch zwischen den Kategorien und den Tags kommt?
=> Dann müssen die unsortierten Listen <ul>, in denen die Kategorien und Tags ausgegeben werden, auch als inline-Elemente oder inline-block-Elemente definiert werden.

Gruß
helix

 

Ähm ja, ich war flüchtig im Code-Lesen.
Deine Tags stecken ja außerdem noch in einem div (=> Block-Element, d.h. das erzwingt einen Zeilenumbruch), d.h. dieses div mit der Klasse .gw-cats muss auch display: inline-block; haben.

Vermutlich kannst du deine Ausgabe viel einfacher gestalten. Weniger html-Elemente. Weniger Klassen.

Gruß
helix

 

Dann spiel mal bitte ein bisschen mit deinen Webentwickler-Werkzeugen rum. Normalerweise kriegt man da ja die Elemente angezeigt und sieht dann auch, wo Umbrüche erzwungen werden etc.

Wenn du es damit immer noch nicht rausfindest, poste bitte mal den HTML-Code, der durch dein Template ausgegeben wird. Danke.

Gruß
helix

 

Ehrlich gesagt kann ich dem ganzen nicht mehr folgen.

Ich versuche es nochmal zusammenzufassen:

Eigentlich möchtest du alle Kategorien und Tags einfach hintereinander weg haben, also keine Umbrüche oder ähnliches dazwischen, und willst alles zentriert haben?
Der einzige Unterschied zwischen Kategorien und Tags ist nur die Farbe?

Das bekommt man zwar irgendwie mit CSS hingebastelt, ich verstehe aber gar nicht, warum du dann erst so komplizierten HTML Code erzeugst...

Wäre dann nicht folgendes viel sinnvoller:

Code:

Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!

(ist jetzt ungetestet, aber so ungefähr sollte das aussehen).

Das Ergebnis wäre dann: Ein <ul> und darin dann sowohl die Kategorien, als auch die Tags als <li>'s. Die unterschiedlichen Farben kannst du dann definieren, weil die Tags zusätzlich die Klasse "gw-tag" haben.

 

Es ist wie gesagt ungetestet, aber wo ich gerade darüber nachdenke, glaube ich, dass the_category() auch noch ein zusätzliches <ul> ausgibt. Das wäre für diesen Ansatz natürlich kontraproduktiv. Insofern müsste man es wahrscheinlich dann eher so machen (auch ungetestet):

Code:

Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!

 

Ja, es ist auf jeden Fall ein etwas anderer Ansatz. Quasi einfacheren HTML Code ausgeben und damit dann auch weniger Anpassungsaufwand in CSS.

Wegen der Ausgabe der Kategorien. Da hatte ich glaube ich einen Denkfehler.

Ersetz mal get_categories() mit get_the_category($post->ID).

Dann sollte eigentlich nur noch die Kategorien des Beitrags ausgegeben werden.

Das die Gestaltung weg ist, ist normal. Du muss deine CSS Klassen an die neue HTML Struktur anpassen.


PS: Behalte die alte Version am besten auch noch. Falls das hier am Ende nicht zum gewünschten Ergebnis führt, kannst du dann zumindest noch zum alten Stand zurück...

 

Hm, OK. Ich müsste es jetzt selbst ausprobieren. Dann vielleicht Kommando zurück und doch wieder der CSS Weg?

Sorry, Ich dachte so kommen wir vielleicht schneller zu einem guten Ergebnis...