Mobirise / Text-Box mit css
-
- Mitglied (Level 2)
- Beiträge: 17
- Registriert: Mi 10. Feb 2021, 19:19
Mobirise / Text-Box mit css
Hallo forum, ich arbeite gern mit den Texbox-Varianten aus den Tutorials - durchsichtige Texboxen über einem Vollbild.
Etwa so >>>
#mybox {
background: rgba(229, 229, 229, 0.7);
border-radius: 20px;
border: 2px solid #ffffff;
box-shadow: 15px 15px 15px 0px #000000;
padding: 60px;
margin-top: 20px;
margin-left: 800px;
margin-right: 60px;
Durch die Beschaffenheit einiger Fotos hätte ich die Box gerne in der Desktop-Ansicht auf der rechten Seite
Etwa so >>>
Genau diese Variante wird auf Tablet und Smartphones im Portrait nicht mehr responsive angezeigt, der Text bleibt
unsichtbar.
War das Einfügen von margin-left/margin-right der Auslöser?
Wenn ich das weglasse, wird die Textbox zu breit und auf dem Smartphone viel zu schmal.
Wo liegt mein Denkfehler? Ich bedanke mich im Voraus für Vorschläge!
Etwa so >>>
#mybox {
background: rgba(229, 229, 229, 0.7);
border-radius: 20px;
border: 2px solid #ffffff;
box-shadow: 15px 15px 15px 0px #000000;
padding: 60px;
margin-top: 20px;
margin-left: 800px;
margin-right: 60px;
Durch die Beschaffenheit einiger Fotos hätte ich die Box gerne in der Desktop-Ansicht auf der rechten Seite
Etwa so >>>
Genau diese Variante wird auf Tablet und Smartphones im Portrait nicht mehr responsive angezeigt, der Text bleibt
unsichtbar.
War das Einfügen von margin-left/margin-right der Auslöser?
Wenn ich das weglasse, wird die Textbox zu breit und auf dem Smartphone viel zu schmal.
Wo liegt mein Denkfehler? Ich bedanke mich im Voraus für Vorschläge!
Re: Mobirise / Text-Box mit css
margin-left: 800px;
Wie breit ist Dein Handy?
Wie breit ist Dein Handy?
Wenn Dein Pferd tot ist, steig ab.
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Mobirise / Text-Box mit css
Hallo,
so geht das natürlich gar nicht mit den 800px.
Das müsstest Du mit "margin: auto" und/oder Prozentangaben regeln. Sehr wahrscheinlich auch über die einzelnen Breakpoints der CSS immer etwas anders oder (wahrscheinlich) dann am Smartphone ganz weg machen.
Ich habe heute für große Beispiele leider keine Zeit.
so geht das natürlich gar nicht mit den 800px.
Das müsstest Du mit "margin: auto" und/oder Prozentangaben regeln. Sehr wahrscheinlich auch über die einzelnen Breakpoints der CSS immer etwas anders oder (wahrscheinlich) dann am Smartphone ganz weg machen.
Ich habe heute für große Beispiele leider keine Zeit.
-
- Mitglied (Level 2)
- Beiträge: 17
- Registriert: Mi 10. Feb 2021, 19:19
Re: Mobirise / Text-Box mit css
Danke Euch erst mal.
Soll kein spezielles Handy sein, bei mir Samsung S20 Plus ...
Soll kein spezielles Handy sein, bei mir Samsung S20 Plus ...
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Mobirise / Text-Box mit css
das ist bei allen Handys gleich ...
Das kannst Du doch auch mit jedem Textfeld von Mobirise so machen, dann passt das automatisch gleich auch am Handy.
Hier mal einige (bereits vorhandene) Beispiele auf meinen Seiten:
https://mobirise-tutorials.com/Transpar ... grund.html
Hier rutscht dann z.B. die Textbox am Handy unter das Bild:
https://mobirise-tutorials.com/LawyerM4 ... s/Box.html
Das kannst Du doch auch mit jedem Textfeld von Mobirise so machen, dann passt das automatisch gleich auch am Handy.
Hier mal einige (bereits vorhandene) Beispiele auf meinen Seiten:
https://mobirise-tutorials.com/Transpar ... grund.html
Hier rutscht dann z.B. die Textbox am Handy unter das Bild:
https://mobirise-tutorials.com/LawyerM4 ... s/Box.html
-
- Mitglied (Level 2)
- Beiträge: 17
- Registriert: Mi 10. Feb 2021, 19:19
Re: Mobirise / Text-Box mit css
Ich danke Euch herzlich, da komme ich auf eine Lösung.
Ich habe jetzt einen anderen Block genommen, der
in den Block-Einstellungen den Schieber REVERSE hat.
Der schiebt dann den CSS-Block auf die rechte Seite
und er wird auf dem Smartphone UNTER dem Bild angezeigt,
so wie im Beispiel von Tommy.
Ich habe jetzt einen anderen Block genommen, der
in den Block-Einstellungen den Schieber REVERSE hat.
Der schiebt dann den CSS-Block auf die rechte Seite
und er wird auf dem Smartphone UNTER dem Bild angezeigt,
so wie im Beispiel von Tommy.
Wer ist online?
Mitglieder in diesem Forum: Bing [Bot] und 123 Gäste