HTML Dateien mit eigener CSS erfolgreich in ein Modul einbinden

  • Guten Tag liebe Community,


    ich wollte heute in meiner Joomla 3.5.1 Version für einen bestimmten Beitrag eine HTML-Tabelle mit eigener CSS via "custom html modul" einbinden.


    Mein Problem ist nun, wenn ich die CSS meines Templates durch die CSS der Tabelle ergänze, sich das gesamte Template zerschießt. Also habe ich mir das Modul "custom HTML extended" geholt und gleiches dort ausprobiert, was leider zum gleichen Ergebnis führte.


    Leider habe ich nicht viel Ahnung von dem ganzen und habe sicherlich beim Ergänzen der .css einenFehler gemacht. Die Klassennamen der tabellen.css waren jedenfalls noch nicht in template.css vergeben. Was ich also hätte mehr beachten müssen, weiß ich leider nicht.


    Es handelt sich bei der html Tabelle um eine kostenfreie Internetvorlage, die ich aus dem Netz bezogen habe.


    Nun meine allgemeine Frage die vielleicht auch allgmein von Euch beantwortet werden kann:
    Gibt es vielleicht einen anderen einfachen Weg die Tabelle (genauer Pricing Table) in ein eigenes Modul auf einer bestimmten Position einzubinden, s.d. speziell dieses Modul nur auf die tabellen.css zugreift, aber gleichzeitig nicht das template zerstört? Optisch soll das natürlich schön in das Template eingebunden sein.


    Vielen Dank und über ein paar Ideen würde ich mich freuen.

  • Und warum ist alles geheim in deinem Post? Irgendeine Tabelle von irgendwo in irgendeine Seite? Wenn du schnelle Hilfe willst, zeig uns das Problem! Wenigstens das verwendete Grid-System...


    Leider verstehen Browser das STYLE-scoped-Attribut noch nicht (richtig), was die idealere Lösung wäre.


    Also umgib die Tabelle mit einem DIV-Container mit unverwechselbarer CSS-Klasse, z.B , mydiv4mytable.


    Alle CSS-Anweisungen "härtest" du dann ausschließlich für diese Tabelle ab, indem du alle Anweisungen mit einem


    div.mydiv4mytable table


    oder noch härter


    body div.mydiv4mytable table


    oder ähnlich einleitest.


    Damit ist gewährleistet, dass alle diese Anweisungen die Anweisungen der template.css der Hierarchie wegen überschrieben werden und andererseits nicht andere table oder td oder sonstwas der Restseite angesprochen werden.


    Dann nimmst du dir Firebug oder das HTML-CSS-Prüftool von Chrome oder ... und prüfst, was deine Tabelle zum kollabieren bringt und musst das eben ebenso hart in deiner table.css überschreiben oder rücksetzen.

  • Danke für die Antwort.


    Ich habe versucht alles allgemein zu halten, da es dort kommerzielle Inhalte geben wird und ich nicht wollte, dass das hier als Werbung aufgefasst wird.


    Also bei der besagten kostenlosen Tabelle html und css Vorlage handelt es sich um folgende:
    http://codepen.io/vivek-kumar/pen/KoLwz (öffnet css und html im Browser)


    Diese würde ich gerne so wie sie vom optischen her ist auf meiner Joomla Seite in einem eigenen Modul einbinden.


    Die CSS hatte ich so in meine Template.css kopiert, was meine Website dann total zerlegt hat (Siehe Screen).
    http://www.directupload.net/file/d/4446/zqevv8x2_jpg.htm
    (habe weit rausgezoomt, menü rechts oben usw.)


    Ich glaube, ich weiß ungefähr wie Sie das meinen, aber könnten Sie mir das vielleicht speziell auf die css bezogen genauer ausführen? Ich habe wie gesagt leider keine wirklichen css Kenntnisse.


    Danke.

  • Hi,
    das was du auf Codepen gepostet hast ist aber keine Tabelle. Das sind DIVs und Ul welche nachher aussehen wie eine Tabelle.
    Das macht einen Unterschied!


    Die Frage ist was alles von Codepen übernommen wurde. kann es sein das auch der body aus Codepen mitkopiert wurde?
    Ansonsten würde ich mal auch aus dem CSS den Universalselektor, body udn wrapper weglassen.


    Aber ohne den wirklich generierten Code von deiner Webseite zu sehen ist es für uns als würden wir in einer Glaskugel, welche auch noch Beschlagen ist, schauen und versuchen zu erkennen wo die Fehler liegen.


    Zitat

    Ich habe versucht alles allgemein zu halten, da es dort kommerzielle Inhalte geben wird und ich nicht wollte, dass das hier als Werbung aufgefasst wird.


    Nur wegen einer URL wird es wohl nicht dazu kommen.


    PS: Wir duzen uns hier alle :).