Ergebnis 1 bis 20 von 20

Thema: Zeilenumbruch im Main/Layout verhindern - horizontal scrollen?

  1. #1
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Gesicht zeigt die Zunge Zeilenumbruch im Main/Layout verhindern - horizontal scrollen?

    Hallo zusammen,

    habe ein kleines Layout-Verständnisproblem .

    Und zwar hat das gewünschte Layout eine feste Breite und Höhe.

    Nun würde ich gerne den Inhalt im "main"-Content horizontal scrollen lassen. Es handelt sich dabei um mehrere Bilder in der gleichen Größe die einfach horizontal gescrollt werden sollten.
    Doch leider wird immer automatisch ein Zeilenumbruch eingefügt bzw. maximal so viele Bilder in einer Zeile angezeigt, wie es von der Breite des Layouts möglich ist und die restlichen fangen in der nächsten Zeile an.

    Kann man dies irgendwie umgehen? ScrollPane setzt mir das zumindest nicht so richtig um.

    Vielen Dank im Voraus!

    LG Sarah

  2. #2
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hallo sade,
    dem Umgebenden div mal ein overflow:scroll-x geben -> http://www.css4you.de/example/overflow-y.html

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  3. #3
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    Hey MacKP,

    löst das Problem leider nicht ...

    LG Sarah

  4. #4
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hmm hast mal nen Link zu der Seite?
    Ist schwierig so auf dem Trockenen ;-)

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  5. #5
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    aber ja ... Link

  6. #6
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    So kann man arbeiten ^^

    Versuchs mal so:

    Code:
    #overflow {
    height: 585px;
    overflow-y: scroll;
    width: 2000px;
    }
    Das Element braucht auch noch ne passende Breite (weil es sonst nicht breiter wird als das Umgebende Element) und ne Höhe, damit der Scrollbalken auch noch an der Passenden Stelle liegt ;-)

    Hoffe, das ist das, was du gewollt hast?

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  7. #7
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    Hey

    ja theoretisch so... aber es funkt noch nicht.
    Ich hab es nun mal so eingebaut, aber der Scrollbalken funktioniert nicht bzw. verschwindet im Nirvana... hm.. überseh ich was?

    LG

  8. #8
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Ah... sorry.. gerade eben zu viel rumgespielt...
    Das unheimlich beliebte .block spielt dir jetzt einen Streich...
    Gib mal dem book-i ein overflow:scroll und mach das bei dem #overflow raus. Das sollte dann schon reichen ^^

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  9. #9
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    hey

    ne so gehts auch nicht ... aber ich glaube ich hab generell ne Layouteinstellung falsch...

    Wenn ich beim #overflow "position:absolute;" hinzfüge... gehts... ich glaube nur das ich mich mit dem ganze Designrumgefummle bei den "position"-Angaben ganz verwirrt hab.
    Irgendwie hab ich nun im IE und Firefox kleine Probleme was die Zentrierung des Designs angeht...

    Also das Scrollen funktioniert nun bei folgendem CSS ... und im Safari wird es auch alles richtig angezeigt... nur nicht mehr im IE und Firefox...

    Code:
    #header
    {
        border-bottom:2px solid #c6c6c6;
    }
    
    #wrapper
    {
        height:720px;
        top:50%;
        position:relative;
        margin-top:-360px;
    }
    
    #main
    {
        width:1000px;
        height:620px;
        overflow:auto;
        margin:0;
        padding:0;
    }
    
    #left
    {
        margin-top:150px;
    }
    
    #footer
    {
        border-top:2px solid #c6c6c6;
    }
    
    #overflow
    {
        width:2500px;
        height:600px;
        position:absolute;
    }
    Geändert von sade (12.05.2012 um 00:38 Uhr)

  10. #10
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Hmm bei mir gings auch ohne position.. keine Ahnung warum das nur ne position braucht.
    Aber: was geht dir da flöten? Wo soll das Zentriert sein? War bei mir (FF) bisher nicht anders zu sehen als jetzt.

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  11. #11
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    Im IE und FF wird das ganze Layout um 50% nach oben verschoben, statt vertikal zentriert.


    LG

  12. #12
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Ach LoL
    Ich dachte das soll so ^^
    Oh man... das sieht natürlich dann auch gleich wie ne Internetseite aus ;-)

    Dein Wrapper hat nen margin-top von -360px. Wenn ich das raus nehme passt das super im FF.

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  13. #13
    Contao-Nutzer Avatar von sade
    Registriert seit
    09.01.2010.
    Ort
    Würzburg
    Beiträge
    44

    Standard

    Lach*.... Scherzkeks ))

    Ja wenn ich die -360 rausnehme, ist die vertikale Zentrierung futsch... (in Safari klappt das ja problemlos und sollte -eigentlich- auch in allen anderen gängigen problemlos laufen).
    Hm... muss ich mir was anderes einfallen lassen.

    Auf jedenfall vielen vielen lieben Dank, MacKP!

    LG Sarah

  14. #14
    Contao-Yoda Avatar von MacKP
    Registriert seit
    15.06.2009.
    Ort
    Duisburg
    Beiträge
    13.293
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Ich hab mir das noch mal kurz angeschaut. Dein Problem ist eher Grundsätzlicher Natur... war schon lange her, das ich mal ne Seite so zentriert habe aber mir kam das irgendwie zu einfach vor wie du das gemacht hast *g*

    Hier mal ne kleine Anleitung: http://www.manuel-bieh.de/blog/verti...seiten-mit-css
    Du wirst einen <div> vor dem eigentlichen Wrapper brauchen um den Abstand von oben zu bekommen. Dazu wirst du die fe_page bearbeiten müssen. Also nen neues Seitentemplate erstellen müssen.

    Infos dazu findest du hier und im contao-wiki ;-)

    Viele Grüße
    Contao Pool | C-C-A | MetaModels | [Internetseite -> Mediendepot Ruhr]
    [Arbeitet bei -> Paus Design & Medien]
    "I can EXPLAIN it to you, but I can't UNDERSTAND it for you."

  15. #15
    Contao-Urgestein Avatar von Andreas
    Registriert seit
    19.06.2009.
    Ort
    Mönchengladbach
    Beiträge
    7.706
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Diese Seite hier http://two-some.de/ hatte ich mal nach dieser Anleitung vertikal zentriert. fe_page Anpassung Ist nur ein zusätzliches leeres Element über dem #wrapper: #center.

    Auf deiner Seite bekomme ich das horizontale Scrollen hiermit hin
    HTML-Code:
    #overflow {
      overflow-x: auto;
      white-space: pre;
    }
    #overflow p {
      display: inline;
    }
    Nachdem ich außer der contao.css und dem framework alles CSS entfernt hatte. Müsste man sogar mit ner Galerie hinbekommen, wenn man alle TABLE-Elemente auf display:inline; setzt.
    Bitte!
    Vor Anfragen im Forum HTML validieren.
    Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.

    Vielen Dank an alle Wunschlistenerfüller
    Andreas Burg, Web Solutions

  16. #16
    Contao-Fan
    Registriert seit
    01.07.2009.
    Beiträge
    353

    Standard

    Ich habe eine Seite, bei der die Bilder horizontal aneinandergereiht werden und die gesamte Bildschirmbreite ausfüllen sollen.
    Zudem soll mit dem Scrollrad durch die Bilder hindurch (horizontal) gescrollt werden können.

    Hat jemand eine Ahnung, wie ich da den Scrollbalken an den unteren Fensterrand bekomme?
    Und wie ich es schaffe, die Bilder so zu integrieren, dass sie hintereinander zu liegen kommen und immer soviel zu sehen ist, wie das Fenster hergibt? Die Bilder liegen bereits schön nebeneinander, aber immer nur ganze Bilder – das nächste springt erst "hoch", sobald das Fenster ausreichend vergrössert wird.

    Chris

  17. #17
    Contao-Urgestein Avatar von Andreas
    Registriert seit
    19.06.2009.
    Ort
    Mönchengladbach
    Beiträge
    7.706
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    So wie in meinem Post davor.
    Bitte!
    Vor Anfragen im Forum HTML validieren.
    Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.

    Vielen Dank an alle Wunschlistenerfüller
    Andreas Burg, Web Solutions

  18. #18
    Contao-Fan
    Registriert seit
    01.07.2009.
    Beiträge
    353

    Standard

    Danke – aber das funktioniert nicht, weil ich keine p's habe, die inline dargestellt werden könnten. Mit den Bildern, dem .image_container oder dem .ce_image funktioniert es auch nicht.

    Zudem werden Bilder, die keinen Platz haben, auf eine nächste Zeile gestellt.

    Was habe ich falsch gemacht?

  19. #19
    Contao-Urgestein Avatar von Andreas
    Registriert seit
    19.06.2009.
    Ort
    Mönchengladbach
    Beiträge
    7.706
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Du kannst jedem Element die Eigenschaft display:inline; zuweisen. white-space:nowrap; nicht vergessen, das verhindert den Zeilenumbruch.
    Bitte!
    Vor Anfragen im Forum HTML validieren.
    Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.

    Vielen Dank an alle Wunschlistenerfüller
    Andreas Burg, Web Solutions

  20. #20
    Contao-Fan
    Registriert seit
    01.07.2009.
    Beiträge
    353

    Standard

    Danke – ich hab's irgendwie hinbekommen. Zusammen mit Scrollside funktioniert es absolut genial!

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
  •