-GELÖST- Kriege Fivestar Stars nicht zentriert
am 27.07.2010 - 17:24 Uhr in
Fivestar erstellt in meinem View einen DIV in dem jeder Stern wiederum ein DIV ist, welche mit float:left hintereinander gehängt sind.
<div class="fivestar-widget clear-block fivestar-widget-5">
<div class="star star-1 star-odd star-first">
<div class="star star-2 star-even">
<div class="star star-3 star-odd">
<div class="star star-4 star-even">
<div class="star star-5 star-odd star-last">
</div>Für meine Bildgalerie sollen die Sterne mittig unter dem Bild sitzen (aktueller Stand siehe Bild im Anhang).
Irgendwie hab ich schon alles was ich im Netz gefunden habe und in Frage kommt ausprobiert, aber ich kriege die blöden Herzen nicht mittig unter das Bild der Bildgalerie. Ich hatte z.B. mit margin:auto; rumprobiert, aber ohne irgendeine Auswirkung. Vermutlich habe ich irgendwas falsch gemacht.
Der einzige Erfolg war, wenn ich dem obersten DIV display:inline-block; mitgegeben habe, aber dann hatte ich einen unschönen Abstand zwischen Sternen und Bewertungstext darunter.
Das Problem wird doch sicher schonmal wer gehabt haben.
Wie zentriere ich das die verdammten Sterne? Hilfääää!
| Anhang | Größe |
|---|---|
| Zentrierung.jpg | 7.77 KB |
- Anmelden oder Registrieren um Kommentare zu schreiben

Hast Du dem ersten Div mal
am 27.07.2010 - 20:31 Uhr
Hast Du dem ersten Div mal eine feste Breite gegeben?
Kannst Du einen LInk zur Seite veröffentlichen? Dann wird's für uns einfacher.
Ja, gern. Es geht in diesem
am 29.07.2010 - 08:53 Uhr
Ja, gern. Es geht in diesem Fall um meine private Seite im Gegensatz zu meistens.
-ENTFERNT-
Wenn Dir sonst irgendwas auffällt, was man besser machen kann oder was nicht optimal ist, gern feedback geben.
Noch ein Problem... ich habe
am 28.07.2010 - 15:33 Uhr
Noch ein Problem... ich habe auf der Pinwand die Fivestar-Herzchen rechts gefloatet, was mich schon frust und nerven ohne ENde gekostet hat heute, und nun stelle ich fest, dass die Herzen nun anders angeordnet sind als vorher (nun ist schlecht rechts und gut links).
Durch das Float hat sich also die Reigenfolge der Herzen umgekehrt. kann man das verhindern? Ich vermmute mal nur indem man die andersrum im Quelltext hat oder?
- Man kann doch für fast alles ein Template ändern in Drupal. Kann man denn ein Fivestar-Template machen, welches immer dort eingesetzt wird wo Fivestar benutzt wird? Dann könnte ich das einfach ändern vielleicht.
Kann mir nicht bitte mal
am 28.07.2010 - 16:09 Uhr
Kann mir nicht bitte mal einer weiterhelfen?
Ja sicher für viele hier pipifax, mal eben ein wenig hier und ein bisschen da, soll er halt schnell machen....
Leider ist das nicht für jeden so leicht. Ich sitze da nun schon 2 Tage dran und das finde ich ein wenig nervig für eigentlich solch totalen Kleinkram, nur weil ich nicht weiss wie..... Vielleicht könnte sich ja mal wer erbarmen? Ich möchte auch möglichst zügig wieder den User löschen.
Vielen Dank!
local.css -> Zeile
am 28.07.2010 - 16:20 Uhr
local.css -> Zeile 87
.galeriekategorie div.fivestar-widget {
margin-left:48px;
}
Damit rückst Du die FiveStar Sternchen nach recht um 48 Pixel und es sieht relativ zentriert aus. Sieht zumindest im Firefox zentriert aus ...
Vielen Dank, aber das geht so
am 28.07.2010 - 16:28 Uhr
Vielen Dank, aber das geht so nicht, da je nach Browserbreite die Abstände schwanken, es muss leider wirklich zentriert werden.
Habe ich nicht gesehen, daß
am 28.07.2010 - 16:42 Uhr
Habe ich nicht gesehen, daß das keine feste Breite ist ... Versuches es mal mit local.css -> Zeile 55
Wenn Du aus:
.galeriekategorie .view-content {
font-size:0.85em;
line-height:1em;
text-align:center;
}
das "text-align:center;" entfernst, dann sieht es besser aus ....
Ja, so war es ja zuerst, aber
am 28.07.2010 - 16:52 Uhr
Ja, so war es ja zuerst, aber da alles unter den Bildern zentriert sein soll hab ich genau die Zeile rein gemacht. Sie zentriert ja auch alles superschön, nur nicht die Herzen.
Das ist ja genau mein Problem.
Die Lösung?
am 28.07.2010 - 17:44 Uhr
Hallo Gork,
versuchs mal in der fivestar.css
mit folgendem Code ;-)
div.fivestar-widget {display:inline-block;
}
So habe ich es zumindest bei mir mit Firebug hinbekommen, daß die Sterne dann auch zentriert angezeigt werden und das sonstige Layout nicht zerschießen. Allerdings dann die von Dir nicht gewollte Leerzeile unter den Sternen.
Mit
display:-moz-boxoder
display:-moz-grid-groupund auch
display:-moz-inline-boxwäre das nicht der Fall, allerdings vermute ich, daß es dann im IE oder anderen Browsern nicht klappt.
Hier würde ich an Deiner Stelle mal experiemtieren, was mit Firefox und Firebug alles direkt online möglich ist. Die Änderungen kannst Du dann ja offline in die entsprechende .css übertragen. Eine andere Lösung wüsste ich ad hoc auch nicht (bin aber auch nicht so der Freak in Sachen css)
Gruß
Rainer
Ja ... da hat der Herr Lich
am 28.07.2010 - 17:51 Uhr
Ja ... da hat der Herr Lich recht!
mit "display:inline-block" ist es im FF zentriert. Wegen des Abstandes kannst du ja dem div.description ein negatives margin-top mitgeben ... dann dürfte der Fall gelöst sein :-)
Erstmal vielen Dank für eure
am 29.07.2010 - 08:55 Uhr
Erstmal vielen Dank für eure Mühe und die guten Tips!
Das mit dem Inline-Block hatte ich ja auch schon probiert ehe ich hier geschrieben habe (weiss nicht ob ich es oben erwähnt hatte oder vergessen hab), aber wie ihr schon vermutet habt geht es soweit ich weiss nur im neuesten IE und in Opera/Firefox. Außerdem hatte ich einen unschönen Abstand den ich nicht weg bekam. Daher hab ich`s als Lösung auch verworfen.
Allerdings habe ich gestern Abend als ich nach Hause kam noch 3h rumprobiert und es hinbekommen.
Ich habe dem div was die Sterne enthällt margin-left / margin-left:auto; mitgegeben und die Breite auf ich glaube 86px gesetzt. Dies hatte ich auch vor dem Post hier schon zig mal probiert, zuletzt nochmal als es hier wer schrieb, aber aus irgendeinem Grund hat es vorher nie geklappt. Entweder lag es an einer anderen CSS Anweisung, die vorher zusätzlich noch fehlte und nun nach meinem Rumprobieren da war, oder ich hab mich vorher vertippt, keine Ahnung, nun geht`s jedenfalls mitmal.
Vielen Dank!
Ps.: DAS hat mich mal echt Nerven gekostet! 2 Tage für so einen Kleinkram.....