Protostar: Grafik im Content- und Left-Bereich, Hintergrund fixieren und Textbegrenzung.

    Hallo liebe Leute,


    jetzt brauche ich auch mal drei Tritte in die richtige Richtung [Seite ist noch im Aufbau, aber Online ;) ]:



    1. Ich möchte gerne den schwarzen Balken am unteren Ende über die ganze Breite im Content haben, auch wenn sich die Contenthöhe aber nicht die Menühöhe verändert:






    2. Ich möchte gerne den Text beim Abschluß der Grafik begrenzen, wobei der Content die Breite behalten sollte:
    (Ich habe es mit CSS versucht, auch responsive Tables, aber ich krieg es nicht hin).








    3. Ich möchte gerne den Hintergrund in dieser Ansicht so fixieren und scrollen können wie hier.




    Und hier noch der Link.


    Vielen Dank!

  • Zum hilfreichsten Beitrag springen

    Hallo Elwood,


    zu 1: meinst Du diesen Minibalken da unten?


    Edit: Du meinst auf einer Unterseite - das sieht man beim Link natürlich nicht sofort.


    Was ist denn, wenn Du das Bild des schwarzen Balen in den Footer setzt - dann geht er über die gesamte Breite ohne viel Aufwand

    In deinem Fall ist das Bild im Text jeweils mit 600px Breite festgelegt.
    Also musst du auch um den Text ein <div> mit der max-width: 600px Breite haben, aber das ist keine gute Lösung.
    Du könntest die Bilder als header-bilder "Komplettes Beitragsbild" eintragen. Dann sollte es automatisch an die Breite angepasst werden, auch wenn es dann auf 100% gebracht wird. Dann stimmt der Rand immer.

    • Hilfreich

    Christiane, muss Deins erst lesen - hab meines im Kopf zurechtgestutzt (notiert) und leg mal los: Ist mal eher eine Bestandsaufnahme :)


    Hallo Timo, ich nehm mir Punkt 2)


    a) Tätigkeitsfelder:


    <table class="responsive rt" style="height: 25px;" width="605">
    HTML Code = table.responsive.rt / template.css / 1717


    b) Geschlossene Fonds (Dein Bild) - Unterschied zu a):


    <style="height: 33px;" width="605", table class="responsive rt">
    HTML Code = style=“height:.responsive.rt


    siehst Du auch beim Seitenquelltext.


    Nun ja, denke Du hast deswegen mit Tabelle probiert, weil Du den Text begrenzen willst. Hmm.
    Der content ist: main#contentspan9 > nimmt er sich, wenn rechts kein span3 für ein Modul ist.


    Liebe Grüße, Christine

    Um die schwarze Hintergrundleiste zu fixieren, das hier eintragen:

    Code
    .website-header {
position:fixed;
top:0;
}
.bg-image-module {
position:fixed;
top:25px;
}


    Allerdings stimmt da oben was noch nicht. Habe derzeit nur 50% schwarz, wenn ich das so einfüge.


    Unten fixierst du genauso, nut mit einem "bottom:0;"


    Auf deiner Beispielseite "wie es sein soll" hast du den Content zweigeteilt. Oben datt Schwarze und dann erst den Inhalt. Und du hast die hellen Seiten-Paddings nicht. Die zerreißen dir natürlich zwangsweise das Bild.


    Wenn du unten fixieren willst, musst du das auch in den Hintergrund legen. Sonst geht das nicht. Wüßte zumindest nicht wie...



    Hoffe, das hilft dir ein wneig weiter.



    Axel

    @Oberaffe: Das hatte ich vorher schon versucht, aber nicht optimal hinbekommen. Nach deinem Tipp habe ich es noch mal versucht und konnte es nach Ausblenden von .hr in der CSS tatsächlich realisieren. Vielen Dank dafür!


    @firstlady: Habe die Images als Beitragsbilder gesetzt. Der Text blieb aber leider so. Nach dem Input von Christine habe ich auf der Modulposition 7 ein Modul 'Eigene Inhalte' gesetzt, um dort eine Abstand zu bekommen. Werde diesen Abstand aber noch optimieren. Auch dir ein Dank!


    @christine2: Das tut mir leid. Es waren noch Reste von meinen RT-Tables-Versuchen. Habe sie auch schon rausgenommen. Aber der Tipp mit 'wenn rechts kein span3 für ein Modul ist' habe ich mit dem Custom-Modul bearbeitet. Vielen Dank!


    @time4mambo: Hallo Axel, ich habe es versucht, aber es funktioniert so nicht. Ist auch nicht weiter schlimm. Hätte die mobile Ansicht besser aufgewertet. Aber so ist auch ok. Leider habe ich heute keine Rose (Hilfreich) für dich, (ich schau das nicht ;) ) da ich leider nur drei vergeben kann.
    Auch dir Danke für die Antwort.


    Ich werde die Seite jetzt noch ein wenig optimieren. Der Kunde ist mit der Desktopansicht und der mobilen Ansicht so zufrieden.


    Vielen Dank!


    Gruß.