Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Mobirise - Text in mobiler Ansicht linksbündig
#1
Oft werden Texte in der mobilen Ansicht zentriert. Welche css-Class muss man verwenden, um Texte auf dem Smartphone linksbündig anzuzeigen? Ich bin mit Bootstrap und Media Queries nicht vertraut, vielleicht habt Ihr eine Idee.

Es geht um diesen Block:

https://mobirise.com/blocks/timelines-mobirise-4.html

Soll auf dem Desktop so bleiben wie es ist aber auf dem Smartphone sieht es zentriert nicht gut aus.
Lieben Gruß
Barbara
--------------
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
Du musst gar keine Class einsetzten!

Markiere den Text!
Dann rechtsbündig, dann mittig zentrieren und wiedr linksbündig zentrieren.
Fertig
Mit freundlichen Grüßen
Claus aus dem hohen Norden

...am achten Tag schuf Gott den Rechtsanwalt
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Wenn es so einfach wäre :D

Der Text soll nur am Smartphone linksbündig werden. Sonst ist der Text im Beispiel oben in den Kästchen mal rechts mal linksbündig angeordnet, was auch richtig ist.

Anderes Beispiel:

Im Block mit Content und den zwei Trennstriche oben und unten kann man in den Einstellung "linksbündig" einstellen, aber auf dem Smartphone bleibt der Text zentriert.
Lieben Gruß
Barbara
--------------
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
(06.03.2018, 12:16)barbara0701 schrieb: Anderes Beispiel:
Zitat:Im Block mit Content und den zwei Trennstriche oben und unten kann man in den Einstellung "linksbündig" einstellen, aber auf dem Smartphone bleibt der Text zentriert.

Den Block nutze ich auch
Ich kann das nach dem Prinzip hin und her, linksbündig einstellen.
Habe ich gerade hier gemacht....schau auf dem Smartphone selbst
http://lavita.agentur28.de/index.php
Mit freundlichen Grüßen
Claus aus dem hohen Norden

...am achten Tag schuf Gott den Rechtsanwalt
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
Claus,
es geht um den Timeline-Block, wenn ich das recht verstehe...

Babs, das geht einfach und wie folgt:

Im CSS-Editor des Timeline-Blockes gibt es den BEreich für Smartphones:

@media (max-width: 768px) {
.iconBackground {
left: 0 !important;
}
.separline:before {
left: 0!important;
}
.timeline-text-content {
margin-left: 0 !important;
text-align: left;
}
}

in der class ".timeline-text-content" habe ich nur die Anweisung "text-align: left;" hinzugefügt.

Dann klappt das, dass der Text in der Samrtphone-Ansicht linksbündig dargestellt wird.
lg Doris
_____________________________________________

Ich wünsche mir 3 Dinge:

1. die Kraft, Dinge zu ändern, die ich ändern kann,
2. die Gelassenheit, Dinge hinzunehmen, die ich nicht ändern kann
3. die Weisheit, beides voneinander zu unterscheiden...


.
NOf 2015 ( HTML 5 Dynamic)
Win 10
Grafik und Bildbearbeitung: Corel Suite X8

Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#6
Was hast Du da wieder hingezaubert! Super! Mit CSS3 Menu, Klasse!
Lieben Gruß
Barbara
--------------
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#7
Zitat:@media (max-width: 768px) {
 .iconBackground {
   left: 0 !important;
 }
 .separline:before {
   left: 0!important;
 }
 .timeline-text-content {
   margin-left: 0 !important;
 text-align: left;
 }
}

Das ist es, vielen Dank Doris!  Kussmund  Kussmund  Kussmund
Lieben Gruß
Barbara
--------------
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#8
den hast du doch in deinem Link gezeigt, Babs.

Daher gehe in Mobirise in deinen Timeline-Block und öffne den Editor. Da stehen dann im Bereich des CSS-Editors schon verschiedene Classen drin. Unter anderem die, die ich gepostet habe. Da musst du nur noch den Text-align hinzufügen in der von mir markierten Class.

Ich mache die Tests allerdings im kostenfreien M4 Standardwerk. Aber ich glaube nicht, dass das in den bezahlten Themes anders aussieht... das kann ich aber nicht beurteilen

Ach, deine Vorbemerkung war für CLaus... Smiling
Vergiss meinen letzten Post
lg Doris
_____________________________________________

Ich wünsche mir 3 Dinge:

1. die Kraft, Dinge zu ändern, die ich ändern kann,
2. die Gelassenheit, Dinge hinzunehmen, die ich nicht ändern kann
3. die Weisheit, beides voneinander zu unterscheiden...


.
NOf 2015 ( HTML 5 Dynamic)
Win 10
Grafik und Bildbearbeitung: Corel Suite X8

Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#9
Zitat:Ich kann das nach dem Prinzip hin und her, linksbündig einstellen.
Habe ich gerade hier gemacht....schau auf dem Smartphone selbst
http://lavita.agentur28.de/index.php

Ja, es ist der gleiche Block, wird bei mir am Smartphone zentriert, wahrscheinlich weil ich mit den Bootstrap-Grid gespielt habe und der Titel zentriert ist. Das bekomme ich schon hin. Vielen Dank!
Lieben Gruß
Barbara
--------------
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 Mobirise 4 Template Peter Pfaff 6 92 09.11.2019, 07:06
Letzter Beitrag: Tommy Herrmann
  MOBIRISE-DRITTANBIETER c-laus 0 58 06.11.2019, 17:31
Letzter Beitrag: c-laus
  Passwortschutz für Mobirise-Block nof15us 10 129 02.11.2019, 18:22
Letzter Beitrag: Tommy Herrmann
  Laufschrift-Text in Mobirise MBR-Parameter Goldschwalbe 8 130 02.11.2019, 08:36
Letzter Beitrag: Goldschwalbe
  Bilder fehlen bei Aufruf von Mobirise Helisto 2 66 31.10.2019, 17:25
Letzter Beitrag: Helisto
  Mobirise lädt meine Seite nicht Manuel 39 364 26.10.2019, 18:03
Letzter Beitrag: Manuel
  Mobirise-Texthintergrund Thomas Saake 5 80 24.10.2019, 20:30
Letzter Beitrag: Martin73
Exclamation Logo in der mobilen Ansicht zu groß! realjustinde 9 198 21.10.2019, 19:26
Letzter Beitrag: Martin73
  oberer Text wird am Handy verschluckt nof15us 3 93 21.10.2019, 17:03
Letzter Beitrag: nof15us
  Logo in der Mobilien Ansicht ändern jomini 5 179 18.10.2019, 11:54
Letzter Beitrag: jomini



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!