Höhe einer Spalte 100%?
Höhe einer Spalte 100%?
Ganz blöde Frage:
ich habe in einem Standard-Block von Mobi einen Block mit links Bild und und rechts text. Es gibt eine Row, darin sind 2 Col-6
Das eine col-6 des Bildes ist so hoch wie die Row, das Col-6 mit dem Text ist halb so hoch - so hoch wie der text-Container eben.
Wie bekomme ich nun die Col mit dem Text-container auf 100% Höhe der Row?
Ein unsichtbares Hintergrundbild will ich nun nicht machen
ich habe in einem Standard-Block von Mobi einen Block mit links Bild und und rechts text. Es gibt eine Row, darin sind 2 Col-6
Das eine col-6 des Bildes ist so hoch wie die Row, das Col-6 mit dem Text ist halb so hoch - so hoch wie der text-Container eben.
Wie bekomme ich nun die Col mit dem Text-container auf 100% Höhe der Row?
Ein unsichtbares Hintergrundbild will ich nun nicht machen
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
bin gerade am Kochen (bekomme gleich Besuch).
... die Seite wäre Hilfreich.
Hast du mal mit der Bootstrap-Class "vh-100" (vertical height) versucht
https://getbootstrap.com/docs/5.0/utilities/sizing/
... die Seite wäre Hilfreich.
Hast du mal mit der Bootstrap-Class "vh-100" (vertical height) versucht
https://getbootstrap.com/docs/5.0/utilities/sizing/
Re: Höhe einer Spalte 100%?
Na ja, dann habe ich 100% der Bildschirmhöhe
www.afripix.de/Birgit-Ihne
Viel Spaß mit den Gästen. Morgen ist auch noch ein Tag!
www.afripix.de/Birgit-Ihne
Viel Spaß mit den Gästen. Morgen ist auch noch ein Tag!
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
nee - 100% (oder was auch immer Du angibst) der Block-Höhe.
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
Die Wechselbilder sind so (ähnlich) - habe das auch noch an anderen Stellen:
https://www.mobirise-tutorials.com/Tuto ... ilder.html
https://www.mobirise-tutorials.com/Tuto ... ilder.html
Re: Höhe einer Spalte 100%?
irgendwo hat Stober nen Denkfehler....
Code: Alles auswählen
<div class="row align-items-start d-flex" style="background:RED">
<div class="col-12 col-md-7 col-lg-6 vh-100 " style="background:green">
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
... ich kann heute leider nicht mehr.
Hast Du nicht mal einen Beispielblock "online", damit man überhaupt versteht um was es geht. So theoretisch kann das doch keiner - ich habe nicht die geringste Ahnung wie dieser Block aussehen könnte.
Dann versuche ich mich morgen damit zu beschäftigen. Auf jeden Fall gehört diese Höhenangabe nicht an eine Spalte (col).
Das gehört nicht in die "col" sondern außen herum, also so ähnlich vielleicht:
Was ich auch noch so gar nicht verstehe, ist die Aufgabenstellung einen Textbereich auf eine Höhe von 100% des Containers zu bringen!?
Sorry - aber was meinst Du damit eigentlich? Der Text kann doch nur so hoch sein, wie dieser vorhanden ist. Geht es Dir da um irgendeinen Hintergrund oder was? Dann müsste man vielleicht mit einem "padding" arbeiten.
Auf was beziehst Du die 100% Höhe überhaupt - das kann ja wohl nicht der Text sein. Der kann doch nur so hoch sein, wie er als Text diesen Raum des Containers füllt
Wenn es nur 3 Worte gibt wird es nur eine Zeile Text geben, gibt es 100 Worte wird es mehrere Zeilen Tex geben, gibt es tausend Worte wird der Text da vielleicht 400% der zur Verfügung stehenden Höhe benötigen, also 4 x so viel Platz wie überhaupt vorhanden ist.
Man muss das sehen, sonst kann man nicht helfen.
Hier mal ein Standard-Textfeld aus der Rubrik "Article". Dieses Textfeld hat im Prinzip die Höhe von seinem Text-Inhalt zuzüglich eines "padding" (Innenabstand) oben und unten.
Will ich die Höhe von diesem Block auf 100% meiner Display-Höhe setzen, dann tue ich das mit vh-100 (vertikale Höhe = 100%) oder auch irgendeine andere Höhe (siehe weiter unten mein Beispiel mit der CSS Class).
In einer "row" (Reihe von 12 "columns") wird sich dann natürlich jede der 12 Spalten vom Bootstrap-Grid-System auf die angegebene Höhe stellen.
Siehe auch meine Demo-Seite zum Bootstrap Grid System hier:
https://www.mobirise-tutorials.com/Tuto ... -Grid.html
Du kannst das auch als neue Class in die CSS schreiben, also z.B.:
Dann ist der Block 40% der Display-Größe hoch:
Ob Du so eine Höhe nun einem einfachen Textblock gibst oder einem Block, der in mehrere Bereiche aufgeteilt ist, sollte doch vollkommen egal sein. Dann musst Du eben dem <div> vom Textbereich die Höhe verpassen.
Wenn Du mal beschreiben und zeigen würdest, welchen Block Du da genau am Wickel hast und um was es Dir dabei überhaupt geht, dann könnte ich ja mal versuchen das nachzustellen.
Bei Text sollte man aber aufpassen, weil sich der Inhalt ja ändern kann und sich dann auch die Höhe ändern könnte.
Auf jeden Fall gehört diese Angabe (meiner Meinung) außen herum in die Zeile (row) und nicht an eine Spalte (col).
Hast Du nicht mal einen Beispielblock "online", damit man überhaupt versteht um was es geht. So theoretisch kann das doch keiner - ich habe nicht die geringste Ahnung wie dieser Block aussehen könnte.
Dann versuche ich mich morgen damit zu beschäftigen. Auf jeden Fall gehört diese Höhenangabe nicht an eine Spalte (col).
Das gehört nicht in die "col" sondern außen herum, also so ähnlich vielleicht:
Code: Alles auswählen
<div class="container h-100">
Inhalt vom Block-Bereich
</div>
Sorry - aber was meinst Du damit eigentlich? Der Text kann doch nur so hoch sein, wie dieser vorhanden ist. Geht es Dir da um irgendeinen Hintergrund oder was? Dann müsste man vielleicht mit einem "padding" arbeiten.
Auf was beziehst Du die 100% Höhe überhaupt - das kann ja wohl nicht der Text sein. Der kann doch nur so hoch sein, wie er als Text diesen Raum des Containers füllt
Wenn es nur 3 Worte gibt wird es nur eine Zeile Text geben, gibt es 100 Worte wird es mehrere Zeilen Tex geben, gibt es tausend Worte wird der Text da vielleicht 400% der zur Verfügung stehenden Höhe benötigen, also 4 x so viel Platz wie überhaupt vorhanden ist.
Man muss das sehen, sonst kann man nicht helfen.
Hier mal ein Standard-Textfeld aus der Rubrik "Article". Dieses Textfeld hat im Prinzip die Höhe von seinem Text-Inhalt zuzüglich eines "padding" (Innenabstand) oben und unten.
Will ich die Höhe von diesem Block auf 100% meiner Display-Höhe setzen, dann tue ich das mit vh-100 (vertikale Höhe = 100%) oder auch irgendeine andere Höhe (siehe weiter unten mein Beispiel mit der CSS Class).
In einer "row" (Reihe von 12 "columns") wird sich dann natürlich jede der 12 Spalten vom Bootstrap-Grid-System auf die angegebene Höhe stellen.
Siehe auch meine Demo-Seite zum Bootstrap Grid System hier:
https://www.mobirise-tutorials.com/Tuto ... -Grid.html
Du kannst das auch als neue Class in die CSS schreiben, also z.B.:
Code: Alles auswählen
.meinheight {
height: 40vh;
}
Dann ist der Block 40% der Display-Größe hoch:
Ob Du so eine Höhe nun einem einfachen Textblock gibst oder einem Block, der in mehrere Bereiche aufgeteilt ist, sollte doch vollkommen egal sein. Dann musst Du eben dem <div> vom Textbereich die Höhe verpassen.
Wenn Du mal beschreiben und zeigen würdest, welchen Block Du da genau am Wickel hast und um was es Dir dabei überhaupt geht, dann könnte ich ja mal versuchen das nachzustellen.
Bei Text sollte man aber aufpassen, weil sich der Inhalt ja ändern kann und sich dann auch die Höhe ändern könnte.
Auf jeden Fall gehört diese Angabe (meiner Meinung) außen herum in die Zeile (row) und nicht an eine Spalte (col).
Re: Höhe einer Spalte 100%?
Moin Tommy,
der SALESPROFI aus dem Mobi-Forum hatte die Lösung.
Der umgebende Container muss d-flex sein. Erst dann funktioniert das h-100.
Wusste ich nicht.
Und natürlich gab es den Block online (jetzt ist er nicht mehr grün), hatte ich oben übersehenerweise doch geschrieben.
https://www.afripix.de/Birgit-Ihne/
Es geht um die Blöcke unter LEBENSBERATUNG.
Der Strich unter dem Text sollte ganz unten mit dem Bildende auf einer Höhe sein. Das war der Grund für die Geschichte!
der SALESPROFI aus dem Mobi-Forum hatte die Lösung.
Der umgebende Container muss d-flex sein. Erst dann funktioniert das h-100.
Wusste ich nicht.
Und natürlich gab es den Block online (jetzt ist er nicht mehr grün), hatte ich oben übersehenerweise doch geschrieben.
https://www.afripix.de/Birgit-Ihne/
Es geht um die Blöcke unter LEBENSBERATUNG.
Der Strich unter dem Text sollte ganz unten mit dem Bildende auf einer Höhe sein. Das war der Grund für die Geschichte!
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
Moin,
ah - dann wird das auch klar ...
Ich denke in Mobirise ist es immer besser eigene CSS-Klassen zu verwenden als solche Bootstrap-Klassen, denn Mobirise hat die oft bereits manipuliert.
Muss ich den Link wohl übersehen haben - ich hatte keine Ahnung um was es Dir da wirklich geht.
Tolles Design - echt gut
ah - dann wird das auch klar ...
Ich denke in Mobirise ist es immer besser eigene CSS-Klassen zu verwenden als solche Bootstrap-Klassen, denn Mobirise hat die oft bereits manipuliert.
Muss ich den Link wohl übersehen haben - ich hatte keine Ahnung um was es Dir da wirklich geht.
Tolles Design - echt gut
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
Hier habe ich jetzt mal den grünen Block dem linken Block mit dem Bild in der Höhe angepasst.
Einfach noch in die CSS geschrieben:
height: 114.5vh;
So sieht es ohne diese Anpassung gerade noch in Deiner Original-Seite aus:
Einfach noch in die CSS geschrieben:
height: 114.5vh;
So sieht es ohne diese Anpassung gerade noch in Deiner Original-Seite aus:
Re: Höhe einer Spalte 100%?
Na ja, bei weniger Text wird die Höhe dann wieder anders?
Die Salesprofi-Lösung ist noch nicht online, aber das d-flex und h-100 muss ich inbedingt im Kopf behalten - na wenn das mal klappt!
Die Salesprofi-Lösung ist noch nicht online, aber das d-flex und h-100 muss ich inbedingt im Kopf behalten - na wenn das mal klappt!
- Tommy Herrmann
- Site Admin
- Beiträge: 5867
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Höhe einer Spalte 100%?
da müsste man erst mal probieren - weiß gar nicht was ich da auf die Höhe gestellt habe. Wenn der Text länger als die Box links (mit dem Bild) wird, dann passt das natürlich nicht mehr.
Ein Flex steht da aber sowieso schon in der Class mit dabei.
Ich hätte das ja mal selbst ausprobiert, nur weiß ich immer noch nicht welcher Block aus welchem Thema das ist
Wenn, muss man das immer an dem Block um den es geht testen, denn viele Mobirise Blöcke haben Bugs und sind eben sehr oft auch ganz anders konfiguriert als andere ganz ähnliche Blöcke. Es macht also keinen Sinn, einen anderen Block entsprechend zu testen.
Ein Flex steht da aber sowieso schon in der Class mit dabei.
Ich hätte das ja mal selbst ausprobiert, nur weiß ich immer noch nicht welcher Block aus welchem Thema das ist
Wenn, muss man das immer an dem Block um den es geht testen, denn viele Mobirise Blöcke haben Bugs und sind eben sehr oft auch ganz anders konfiguriert als andere ganz ähnliche Blöcke. Es macht also keinen Sinn, einen anderen Block entsprechend zu testen.
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 125 Gäste