Speisekarte in eine Zeile ? Derzeit alles verutscht =/

  • Besser ist wenn Du den Link direkt zum Problem zeigst und keine Screenshots, damit man das leichter untersuchen kann.
    https://wunderbar.netbrix.de/index.php/speisekarte

    Zum Problem:
    Die Karte ist in 2 Spalten aufgeteilt - linke Hälfte und rechte Hälfte.


    Besser ist, wenn es erst in Zeilen und dann je Zeile 2 Spalten sind.

    Ich kenne den SP-Pagebuiler jetzt nicht so, aber kannst Du dort nicht Zeilen einfügen?

    Das Problem entsteht, weil rechts unter "Kleines Bäckerfrühstück" 2 Zeilen darunter sind, währen in der Linken Hälfte nur eine Zeile. Somit rutscht die rechte Hälfte weiter nach unten.

    Beim Zeilenbasierten sind rechte und linke Seite jeweils gleich hoch.

  • Hallo LukasHH


    Vielen Dank für deine schnelle Hlfe.

    Sorry das ich den Link nicht korrekt geschrieben habe.


    Ich habe nun versucht eine weitere Zeile dazwischen einzubauen, leider ohne Erfolg.


    Eine Idee wäre noch, ich kann mit CSS vielleicht eine weitere Zeile steuern?

    Dort gibt es die Funktion "Custom CSS" .

    Nur welchen CSS COde gebe ich dort ein?

    Vielleicht klappt es ja damit.


    Vielen Dank

  • Dass die Zeilen alle auf einer Höhe stehen, wirst Du mit CSS alleine nicht hinbekommen.

    Was Du mit CSS machen kannst, dass die Preise in der Flucht stehen - also die vertikale Ausrichtung:

    CSS
    .sppb-addon-spdiner-pricelist .price-position-right .sppb-addon-title-wrap {
    flex: 0 0 80%;
    max-width: 80%;
    }
    
    .sppb-addon-spdiner-pricelist .price-position-right .pricelist-price-content {
    flex: 0 0 20%;
    max-width: 20%;
    }
  • Dass die Zeilen alle auf einer Höhe stehen, wirst Du mit CSS alleine nicht hinbekommen.

    Was Du mit CSS machen kannst, dass die Preise in der Flucht stehen - also die vertikale Ausrichtung:

    CSS
    .sppb-addon-spdiner-pricelist .price-position-right .sppb-addon-title-wrap {
    flex: 0 0 80%;
    max-width: 80%;
    }
    
    .sppb-addon-spdiner-pricelist .price-position-right .pricelist-price-content {
    flex: 0 0 20%;
    max-width: 20%;
    }

    Vielen Dank, mit den Preisen sieht schon deutlich besser aus.

    Zitat


    Dass die Zeilen alle auf einer Höhe stehen, wirst Du mit CSS alleine nicht hinbekommen.

    Was wäre deine Idee?

    Vielleicht kann mir Elwood helfen als Spezialist ;-) ?

  • Das einzige was ich mittels CSS noch sehe ist, dass Du die Mindest-Höhe für jedes Element fest definierst. Dann werden auch die mit einer Zeile (als Zusatztext) mit größeren Abstand angezeigt.

    CSS
    .sppb-addon-pricelist {
    min-height: 125px;
    }
  • Das einzige was ich mittels CSS noch sehe ist, dass Du die Mindest-Höhe für jedes Element fest definierst. Dann werden auch die mit einer Zeile (als Zusatztext) mit größeren Abstand angezeigt.

    CSS
    .sppb-addon-pricelist {
    min-height: 125px;
    }

    PASST !!!


    Sehr gut LukasHH

    Vielen Vielen lieben Dank .

    @Passt jetzt indirekt nicht zum Thema.

    Wenn du auf der Startseite bist steht doch im Slider


    "Frühstück im Her

    zen Naumburg"


    Richtig soll es Dargestellt werden:


    "Frühstück im

    Herzen Naumburg"


    Weil das Herzen getrennt wurden ist, ich habe es bereits selber versucht zu rutschen und zu ziehen. Aber kein Erfolg.

    Hast du da noch eine Idee ?

  • Besser ist dafür einen eigenen Thread aufzumachen, wenn es ein anderes Problem ist.

    Hier sehe ich keine Möglichkeit - außer Du verwendest diese Animation nicht. Der Umbruch erfolgt an der Stelle, weil die Buchstaben im Quelltext einzeln und nicht als ganzes Wort aufgeführt werden. So wird jeder Buchstabe für sich erkannt und nicht als ganzes Wort.

  • Hallo footix,


    Wegen der Titel im Slider:



    Nun ja, kommt (auch) u.a. von Zeile 1352:

    Code
    .sppb-addon-sp-slider.sp-slider .sppb-sp-slider-title {
        max-width: 690px;
    }

    bzw. (auch) von der font-size: 72px.


    Man könnte die Breite verändern. Würde nicht viel bringen, da es ja unterschiedlich lange Titel gibt.


    Also ev. die font-size verringern (= ein Inline segment).

    Besser ist dafür einen eigenen Thread aufzumachen, wenn es ein anderes Problem ist.

    Hier sehe ich keine Möglichkeit - außer Du verwendest diese Animation nicht. Der Umbruch erfolgt an der Stelle, weil die Buchstaben im Quelltext einzeln und nicht als ganzes Wort aufgeführt werden. So wird jeder Buchstabe für sich erkannt und nicht als ganzes Wort.

    Ja, so ist es.


    Wobei ich SP-Pagebuilder nicht kenne/verwende. Damit kennt sich LukasHH viel besser aus!


    Liebe Grüße

    Christine

  • Damit kennt sich LukasHH viel besser aus!

    Nö - damit kenne ich mich auch nicht aus. Ich arbeite da noch klassisch mit Templates :)
    Aber mit der Schriftgröße könnte man ggf. was erreichen. Frage ist nur, ob das auch bei den unterschiedlichen Medien (Tablet, Smartphone, ...) funktioniert.