Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Seltsames text-Konstrukt
#1
Morgen aus dem Regen in Salzburg!
Ich sitze gerade an einem neuen Projekt. Der Kunde hat bereits eine Seite, die recht sonderbar aufgebaut ist, aber er hat dort ein auf den ersten Blick einfaches Textkonstrukt, was ich für sehr nützlich halte und gerne beibehalten würde. Die Domain kann ich hier nicht nennen.

Es ist ein zweispaltiger Text, wo der Text je nach Bildschirmbreite von einer Spalte in die andere wandert. Ab Tabletgröße wird es eine Spalte.

Verständlich ausgedrückt?

Wie baut man sowas?

Frank
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
Antwort an mich selbst (und falls es sonst noch wen interessiert)
.Spalten {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 40px;
-moz-column-gap: 40px;
column-gap: 40px;
}
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Moin,

das hatte ich doch auf meiner Testseite bezüglich des Grid-Systems schon mal beschrieben:

http://www.mobirise-tutorials.com/Testse...Grid-Sytem

Unter diesem grauen Block mit den 12 Spalten kommt ein weißer Block mit Text und nur 2 Spalten.

Diese Spalten stehen bis zu einer Display-Größe >=768 px nebeneinander und werden an einem kleinen Display untereinander platziert sein.

Das entspricht der Bootstrap class="col-md-6", die dementsprechend jeweils 6 der 12 Spalten verwendet.

Das ist übrigens ein unveränderter Textblock mit eigentlich 3 Spalten aus dem Standard-Thema "Mobirise4", den man über Optionen auf eine andere Spaltenanzahl einstellen kann.
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
... ja - das geht natürlich auch mit der CSS Eigenschaft "column-count" (hatte gerade geschrieben als Du Dir selbst geantwortet hattest :D )

https://www.w3schools.com/cssref/css3_pr...-count.asp
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
Selbstgespräche sind was Tolles: es widerspricht einem keiner.
Die Weiterbildung bleibt allerdings etwas auf der Strecke...

@Tommy: bei Deiner ersten Lösung bleibt der Text aber constant in den Spalten. Bei Column-Count wechselt er zwischen den Spalten.
So ein wenig Bootstrap-grundlagen kann ich ja auch ...
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#6
Ich habe das der Vollständigkeit halber mal noch mit dem "Column Count" hinzugefügt:

http://www.mobirise-tutorials.com/Testse...lumn-Count


P.S.:

ja - das musste ich erst 5 x lesen, dass der Text fließen soll, dann hatte ich es auch verstanden :D

Empfinde ich aber als ziemlich unschön, da ja Texte schon optisch auch vernünftig gesetzt werden und das nicht dem Zufall überlassen werden sollte.
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#7
Ich will jetzt keine Diskussion zum Thema unschön machen, aber Du musst bedenken, das kein normaler Mensch den Browser ständig vergrößert und verkleinert.
Teilst Du mit Bootstrap den text auf 2 Spalten auf, wird bei Umbruch von 2 Spalten auf eine Spalte auf dem Handy immer ein leerer Bereich entstehen, wo halt die Trennung zwischen den Spalten war.
Das kann man durch sinnigen Textinhalt als Vorteil nutzen, ist aber nicht immer möglich.
Manche Kunden bestehen auf Sätze, die mehr als 30 Worte beinhalten - da ist nix mit sinnvollem Aufteilen
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen…
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Slider mit Fade-Übergang und Text stobi_de 11 240 07.06.2020, 13:12
Letzter Beitrag: Tommy Herrmann
  Bild Text Reihenfolge nof15us 8 163 01.06.2020, 09:21
Letzter Beitrag: Tommy Herrmann
  Tab-Konstrukt stobi_de 1 187 08.01.2020, 11:06
Letzter Beitrag: Tommy Herrmann
  Mobirise-Animierten Text nach unten verschieben Thomas Saake 6 364 30.11.2019, 12:47
Letzter Beitrag: Thomas Saake
  Laufschrift-Text in Mobirise MBR-Parameter Goldschwalbe 8 432 02.11.2019, 07:36
Letzter Beitrag: Goldschwalbe
  oberer Text wird am Handy verschluckt nof15us 3 281 21.10.2019, 16:03
Letzter Beitrag: nof15us
  Preisliste? Also text links, preis rechts? stobi_de 28 1.223 30.07.2019, 07:12
Letzter Beitrag: Tommy Herrmann
  Mobrise-Anordnung eines Bildes vor den Text Thomas Saake 4 407 26.07.2019, 10:21
Letzter Beitrag: Thomas Saake
  Mobirise-Dünner Rahmen um Text Thomas Saake 2 383 18.07.2019, 16:39
Letzter Beitrag: Thomas Saake
  in mobirise eingrückte Auflistung im Text geht das funsport 2 426 16.07.2019, 10:12
Letzter Beitrag: Martin73



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!