Anpassung mit Artikelbox - Slider funktioniert nicht.

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Anpassung mit Artikelbox - Slider funktioniert nicht.

      Sehr geehrte cls-design Community,

      ich würde den Artikel Slider von cls-desgin gerne anders einbauen, es soll nämlich neben dem Slider noch ein Video angezeigt werden. Sprich: Zwei Boxen nebeneinander.

      Dazu habe ich folgenden Code verwendet:

      CSS-Quellcode: CSS

      1. body[data-page-id="104"] {
      2. .boxesContentBottom > .boxContainer {
      3. display: flex;
      4. }
      5. .boxesContentBottom > .boxContainer > div:first-of-type {
      6. width: 50% !important;
      7. padding-right: 25px;
      8. padding-left: 20px;
      9. margin-top: 0 !important;
      10. }
      11. .boxesContentBottom > .boxContainer > div:last-of-type {
      12. width: 50% !important;
      13. padding-right: 25px;
      14. padding-left: 20px;
      15. margin-top: 0 !important;
      16. }
      17. }
      Alles anzeigen
      Die Boxen werden nun zwar nebeneinander angezeigt jedoch nimmt die SliderBox nicht die richtige Breite ein. Siehe hier:


      Nun ist die Frage ob ich einen Fehler gemacht habe oder ob so eine Anordnung mit der Sliderbox einfach nicht möglich ist?
      Ich hoffe es findet sich jemand der mir helfen kann.

      Ich bedanke mich schoneinmal im Voraus für jegliche Antworten.

      Mit freundlichen Grüßen,
      Max
    • @Tom Ertsmal danke für Ihre Antwort.

      Allerdings liegt es nicht an der Videobox. Ich habe gerade eine Box mit einem einfachen Textinhalt statt der Videobox eingebunden und habe das gleiche Problem - Der Artikelslider skaliert sich so komisch.

      Haben Sie vielleicht eine Ahnung woran das liegen könnte bzw. wie ich die Boxen gescheit nebeneinander bekomme? Vielleicht mit einem anderen CSS Code?

      Mit freundlichen Grüßen,
      Max
    • So ich muss diesen Thread leider nocheinmal ausgraben.

      Ich habe es lange garnicht bemerkt, da sich niemand beschwert hat aber die Boxen werden Auf Mobiltelefonen und Tablets nicht dem Mobilen Design angepasst.
      Sprich sie werden nebeneinander angezeigt und nicht untereinander, wie es die Boxen normalerweise im mobilen Design machen sollten.

      Mein Code sieht so aus:

      Quellcode

      1. body[data-page-id="104"] {
      2. .boxesContentBottom > .boxContainer {
      3. display: flex;
      4. }
      5. [data-box-identifier="com.cls-design.wcf.box.articleSlider"] {
      6. width: 50% !important;
      7. padding-right: 25px;
      8. padding-left: 20px;
      9. margin-top: 0 !important;
      10. }
      11. [data-box-identifier="com.woltlab.wcf.genericBox73"] {
      12. width: 50% !important;
      13. padding-right: 25px;
      14. padding-left: 20px;
      15. margin-top: 0 !important;
      16. }
      17. }
      Alles anzeigen
      Ich hoffe es kann mir jemand weiterhelfen.

      Mit freundlichen Grüßen,
      Max
    • Am besten so:

      CSS-Quellcode

      1. @include screen-md-up {
      2. body[data-page-id="104"] {
      3. .boxesContentBottom > .boxContainer {
      4. display: flex;
      5. }
      6. [data-box-identifier="com.cls-design.wcf.box.articleSlider"] {
      7. width: 50% !important;
      8. padding-right: 25px;
      9. padding-left: 20px;
      10. margin-top: 0 !important;
      11. }
      12. [data-box-identifier="com.woltlab.wcf.genericBox73"] {
      13. width: 50% !important;
      14. padding-right: 25px;
      15. padding-left: 20px;
      16. margin-top: 0 !important;
      17. }
      18. }
      19. }
      Alles anzeigen
      docs.woltlab.com/view_css.html
      TwitterFacebook

      Mein Blog: TwentyMag <- Lesen, Teilen, Liken, Kommentieren, Abonnieren. Ihr wisst bescheid, was labere ich hier groß rum
      :eyes: