Ergebnis 1 bis 29 von 29

Thema: CSS-Probleme

  1. #1
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard CSS-Probleme

    Hi,

    ich nutze die Tag-Cloud für News unter (jetzt) Contao 3.2.14.

    Nach dem Core-Update auf eben diese Version sind mir Fehldarstellungen in der Tag-Cloud aufgefallen, die ich mir nicht erklären kann. Listenpunkte werden nicht mehr dargestellt oder ragen rechts über den Rand des Moduls hinaus, außerdem sind Lücken in der Cloud.

    Testweise habe ich das aktuelle CSS aus Github importiert, das zeigt aber die gleichen Probleme.

    Eigentlich kann ich mir kaum vorstellen, dass dies mit dem Core-Update zusammenhängt. Ist da irgendetwas in der Richtung bekannt?

    Danke & Gruß
    Alex

  2. #2
    Contao-Urgestein Avatar von ways2web
    Registriert seit
    23.03.2010.
    Ort
    Berlin
    Beiträge
    1.698
    User beschenken
    Wunschliste

    Standard

    schon ne systemwartung durchgeführt oder user-cahe gelöscht in contao?

  3. #3
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Ja, hatte ich; zur Sicherheit jetzt nochmal gelöscht.

    Ich habe mal einen Screenshot mit dem 1:1 aus der aktuellen Github-Version übernommenen Stylesheet gemacht:

    tag-cloud.png

    Gruß Alex

  4. #4
    Contao-Fan Avatar von Bas
    Registriert seit
    03.12.2009.
    Ort
    Hamburg
    Beiträge
    555

    Standard

    Ohne Ansicht der Seite (hast mal nen Link?) kann man nur vermuten.

    Meine Vermutung ... die Tags stehen in einem DIV mit fester Breite, welcher breiter ist als der der umgebende Div der Spalte - und der Spalten-Div hat nen overflow:hidden.

  5. #5
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Das will ich alles nicht abstreiten - ich habe das Template nicht gebaut und bin noch nicht komplett in die Struktur eingestiegen. Aber es hat ja seltsamerweise bisher immer funktioniert, und ich habe zuletzt nichts daran geändert.

    Hier ein temporärer Link zur Seite.

    Gruß Alex

  6. #6
    Alter Contao-Hase Avatar von bizon
    Registriert seit
    16.06.2010.
    Beiträge
    1.125

    Standard

    Kleine Änderung im CSS ist nötig:
    Code:
    ul.cloud li {display:inline;}
    ändern in
    Code:
    ul.cloud li {display:inline-block;}
    dann sollte es wieder passen.

  7. #7
    Contao-Fan
    Registriert seit
    21.08.2012.
    Beiträge
    280
    User beschenken
    Wunschliste

    Standard

    Moinsen,


    sieh mal den Screenshot, im Chrome mit Developer Tools analysiert:

    tagcloud.PNG


    Grüßn
    Grüße vom Gyer

  8. #8
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Hi,

    "inline-block" zu verwenden, löst das Problem nur zum Teil.

    Zwar werden nun wieder alle Listenpunkte innerhalb des divs dargestellt, aber die "Blocksatz-Optik" wie bisher fehlt.

    Ich kann mir echt immer noch nicht erklären, wo das ganze Problem auf einmal her kommt ...

    Gruß Alex

  9. #9
    Alter Contao-Hase Avatar von bizon
    Registriert seit
    16.06.2010.
    Beiträge
    1.125

    Standard

    Tagcloud benötigt Mootools! Ist das im Seitenlayout aktiviert?
    Im Quelltext kann ich Mootools nicht entdecken.

  10. #10
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    War es tatsächlich nicht - im Composer ist mir diese Abhängigkeit gar nicht aufgefallen.

    Habe es jetzt eingebunden - verändert hat sich allerdings nichts.

    Gruß Alex

  11. #11
    Alter Contao-Hase Avatar von bizon
    Registriert seit
    16.06.2010.
    Beiträge
    1.125

    Standard

    Beide Frameworks zu laden, sorgt oft für etwas Mehrarbeit.

    Mootools muss vor jQuery geladen werden und jQuery Skripte müssen eindeutig als solche maskiert werden. Stichwort ist jQuery-noConflict, da wirst du dich Einlesen müssen.

  12. #12
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Setzt Contao 3 den noConflict-Modus nicht automatisch? Ich habe jedenfalls im Seitenlayout keine Möglichkeit gefunden, die Reihenfolge der Bibliotheken zu beeinflussen oder wie unter 2.11.X ein moo_jquery_nc einzubinden.

    Testweise hab ich jquery mal aus dem Layout rausgenommen, aber geändert hat sich auch nichts.

    Gruß Alex

  13. #13
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Hallo,

    ich krame mal das Thema wieder raus. Ich habe das gleiche Problem. Die inline-block löst zwar das Problem der nicht sichtbaren Teile der Cloud, aber nicht diese "Blocksatz"-Geschichte.

    Ich habe das mit und ohne Mootools probiert und sehe da keine Veränderung. Ein Blick in die "tagcloud.js" offenbart, dass da sowohl jQuery als auch Mootools angesprochen werden. Leider funktioniert jQuery aber auch nicht.

    Gibt es da eine Lösung?


    Grüße,
    Christian
    Geändert von savuti (24.03.2015 um 08:56 Uhr)

  14. #14
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Ich wäre auch sehr an einer Lösung interessiert - bis jetzt habe ich den Blocksatz nicht in den Griff bekommen.

    Gruß Alex

  15. #15
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    35.517
    Partner-ID
    10107

    Standard

    Zitat Zitat von bizon Beitrag anzeigen
    Beide Frameworks zu laden, sorgt oft für etwas Mehrarbeit.

    Mootools muss vor jQuery geladen werden und jQuery Skripte müssen eindeutig als solche maskiert werden. Stichwort ist jQuery-noConflict, da wirst du dich Einlesen müssen.
    Beides ist nicht notwendig. Das entsprechende JavaScript muss einfach korrekt geschrieben werden, damit es nicht in Konflikt kommt. tagcloud.js der Tags Extension liefert korrekten Code für jQuery und MooTools, soweit ich das sehe.


    Zitat Zitat von savuti Beitrag anzeigen
    Gibt es da eine Lösung?
    Zitat Zitat von mv_alex Beitrag anzeigen
    Ich wäre auch sehr an einer Lösung interessiert - bis jetzt habe ich den Blocksatz nicht in den Griff bekommen.
    Eine Lösung wofür nun genau? Ohne Link zur Seite wird man nur begrenzt helfen können.

  16. #16
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Hallo Spooky,

    danke für deine Antwort. Im Moment ist das noch eine Baustellen-Seite. Zu finden unter dev.polises.de. Die Cloud ist in der rechten Marginalspalte unter dem blauen "Blog"-Bereich.

    Viele Grüße,
    Christian

  17. #17
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    35.517
    Partner-ID
    10107

    Standard

    Damit sollte es gehen:
    PHP-Code:
    ul.cloud::after {
        
    content:" ";
        
    display:inline-block;
        
    width:100%;
        
    height:0;

    http://jsfiddle.net/evpmextp/

  18. #18
    Wandelndes Contao-Lexikon Avatar von tab
    Registriert seit
    22.10.2013.
    Beiträge
    10.198
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hmm, da wird aber "summer school" und "social networks" auseinander gerissen. Sind solche tags eigentlich zulässig?

  19. #19
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Leider nein. Das würde die letzte Zeile auch auf justify zwingen. Aber schon die erste Zeile zickt da rum. Ich habe jetzt mal auf deine Variante angepasst. Leider wird jetzt hier die erste Zeile so lang, dass es über den Rand schießt. Und der Blocksatz geht nicht. Magst du nochmal schauen?

    Ich habe das mal mit geschützten Leerzeichen (social[nbsp]networks) probiert, das müsste doch eigentlich gehen, oder?

    Das Verrückte: Auf http://www.contao-anleitungen.de/blog.html?page_n1=2 ist genau die gleiche Ausgabe, aber da funktioniert es.
    Geändert von savuti (24.03.2015 um 10:55 Uhr)

  20. #20
    Wandelndes Contao-Lexikon Avatar von tab
    Registriert seit
    22.10.2013.
    Beiträge
    10.198
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hmm, verrückte(?) Idee. Bei der einen (nicht funktionierenden) Seite ist der Seitenquelltext komprimiert, bei der anderen nicht. Das Komprimieren führt u.a. dazu, dass zwischen den li's kein Leerzeichen (oder Zeilenumbruch) mehr steht. Vielleicht liegt es daran.

  21. #21
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Bingo!!!

    Darauf wäre ich nie gekommen! Danke dir! Zwar doof, dass es nur ohne Komprimierung geht, aber damit kann ich erstmal leben. Hauptsache der Fehler ist gefunden!

  22. #22
    Wandelndes Contao-Lexikon Avatar von tab
    Registriert seit
    22.10.2013.
    Beiträge
    10.198
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Eventuell klappt es ja auch, wenn du mit
    HTML-Code:
    ul.cloud li::after {
      content: " ";
    }
    da ein Leerzeichen dazwischen machst.

  23. #23
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Die Idee hatte ich auch gerade. Mensch, Mensch, Mensch du hast heute eindeutig die Medaille gewonnen! Klappt jetzt alles bestens. Ich habe das after hinter der ul wieder weggemacht, sonst zerreißt es mir die Worte doch zu sehr.

    Vielen Dank und viele Grüße,
    Christian

  24. #24
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    35.517
    Partner-ID
    10107

    Standard

    Zitat Zitat von savuti Beitrag anzeigen
    Das würde die letzte Zeile auch auf justify zwingen.
    Oh, ich dachte darum geht es hier.
    Geändert von Spooky (24.03.2015 um 13:14 Uhr)

  25. #25
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Hallo zusammen,

    bei mir (Link) greifen diese Änderungen leider nicht. Ich seh aber nicht, was ich anders gemacht hätte.

    Gruß Alex

  26. #26
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Moin,

    bei "ul.cloud li" "float:left" raus und "display" auf "inline" anstatt auf "inline-block". Dann funktioniert es.

    Code:
    ul.cloud li {
      display: inline;
      margin: 0;
      padding: 0;
    }
    Grüße

  27. #27
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Danke! Das ist schon fast perfekt!

    Allerdings rücken umgebrochene Zeilen nach links über den div-Rand; und nicht alle Zeilen werden mit Blocksatz gefüllt, obwohl die Tags von der Breite her in eine Zeile passen sollten.

    So weit ich mich erinnere, war das "früher" nicht - kriegt man das auch in den Griff?

    Gruß Alex

  28. #28
    Contao-Nutzer
    Registriert seit
    31.05.2011.
    Beiträge
    91

    Standard

    Da ist wohl "Neuss-Grevenbroicher Zeitung" einfach zu breit. Selbst wenn du das padding bei "ul.cloud li a" entfernst, reicht der Platz nicht aus. Entweder kürzere Tags verwenden oder "#left" mehr Breite geben (hast da eh nach links 50px padding?) oder halt die Schriftgrößen anpassen.

  29. #29
    Contao-Fan
    Registriert seit
    19.06.2009.
    Beiträge
    681

    Standard

    Da werd ich wohl noch ein wenig rumprobieren ...

    Vielen Dank für Deine/Eure Hilfe!

    Gruß Alex

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •