Ränder mobiles Layout zu breit

04.06.2024 14:26
avatar  Ina-Dui
#1 Ränder mobiles Layout zu breit
avatar
Mitglied

Vielleicht kann mir ja hier jemand weiter helfen.
Im mobilen Layout auf dem Smartphone sind die Seitenränder leider sehr breit:



Wie und wo kann ich das ändern?

Viele Grüße, Ina.


 Antworten

 Beitrag melden
05.06.2024 09:28
#2 RE: Ränder mobiles Layout zu breit
l2
Mitglied

wenn es dir um die Schnellantwort geht

Admin - Layout - Mobil - SCSS/CSS - SCSS/CSS-Addon

1
2
3
4
 
@include media-breakpoint-down(xxs) {  /*  xs=568,xxs=320px */
#quickreply_container {padding-inline : 2px }
#quickreply > div.card-header.clearfix {padding: 0 }
}
 





... würde es „Fussball spielen” heissen

vG Bernd‍

 Antworten

 Beitrag melden
05.06.2024 10:07
avatar  Ina-Dui
#3 RE: Ränder mobiles Layout zu breit
avatar
Mitglied

Danke Dir erstmal. Es geht nicht nur um die Schnellantwort, sondern ums komplette Forum in der mobilen Anzeige.
Die Ränder sind überall so breit.


 Antworten

 Beitrag melden
05.06.2024 11:08
#4 RE: Ränder mobiles Layout zu breit
l2
Mitglied

Zitat von Ina-Dui im Beitrag #3
Die Ränder sind überall so breit.


meinst du das nur für dein Forum oder allgemein? Sind dir z.B. hier im Support die Ränder auch zu breit?

Wenn es nur in deinem Forum so ist, brauchte man zur Analyse ein Adresse.





... würde es „Fussball spielen” heissen

vG Bernd‍

 Antworten

 Beitrag melden
06.06.2024 09:33 (zuletzt bearbeitet: 06.06.2024 09:34)
avatar  Ina-Dui
#5 RE: Ränder mobiles Layout zu breit
avatar
Mitglied

Das betrifft nur mein Forum: https://pwtest.xobor.de/forum.php
Das Supportforum hier wird mir auf dem Mobiltelefon nicht mit so breiten Rändern angezeigt.


 Antworten

 Beitrag melden
06.06.2024 15:19
#6 RE: Ränder mobiles Layout zu breit
l2
Mitglied

Zitat von Ina-Dui im Beitrag #5
Das betrifft nur mein Forum: https://pwtest.xobor.de/forum.php
Das Supportforum hier wird mir auf dem Mobiltelefon nicht mit so breiten Rändern angezeigt.


du hast Recht, dein Forum unterscheidet sich:

verantwortlich für die Ränder ist dieser Container

<div class="main container"> ... </div>

für den gelten 2 CSS-Regeln: ( hier im Support, und auch bei mir im V4 mobilview)


.container { width: 100%; }

@media { min-width: 320px) {
.container {
max-width: 568px;
}
}

bei dir jedoch ist die maximale Breite so definiert:

@media { min-width: 320px) {
.container {
max-width: 320px;
}
}

ich habe keine Erklärung, wie es dazu kommt.

Ein Eintrag in
Admin - Layout - Mobil - SCSS/CSS - SCSS/CSS-Addon

1
2
3
4
5
6
7
 

@media { min-width: 320px) {
.container {
max-width: 568px;
}
}
 
 



würde die Sache bereinigen. Vielleicht weiß jemand anderes, wo der Wert (oder breakpoint) falsch eingetragen ist





... würde es „Fussball spielen” heissen

vG Bernd‍

 Antworten

 Beitrag melden
06.06.2024 16:11
avatar  Mike48
#7 RE: Ränder mobiles Layout zu breit
avatar
Mitglied

Mit den breakpointd gab es Probleme.
xxxs, xxs und xs
Ich weiß nicht ob die jetzt richtig gesetzt sind und richtig funktionieren


www.friends-of-xobor.de (621181 - Template kann wechsel bei Pluin Tests)
www.seniorenclub-sel-koeln.de (578865 - V6 Template)

 Antworten

 Beitrag melden
07.06.2024 07:14
avatar  Ina-Dui
#8 RE: Ränder mobiles Layout zu breit
avatar
Mitglied

Leider bekomme ich eine Fehlermeldung wenn ich den Code von @l2otbart_57 unter Admin - Layout - Mobil - SCSS/CSS - SCSS/CSS-Addon eintrage:

"Fehlermeldung: parse error: failed at `min-width: 320px) { ` (stdin) on line 3925"


 Antworten

 Beitrag melden
07.06.2024 08:51 (zuletzt bearbeitet: 07.06.2024 09:00)
#9 RE: Ränder mobiles Layout zu breit
l2
Mitglied

das kommt davon, wenn man das Geschriebene nicht ausreichend prüft.

habe nicht nur eine falsche klammer verwendet,

1
2
3
4
5
6
 
@media (min-width: 320px; max-width: 568px;  ) {
.container {
max-width: 667px;
}
}
 
 



es gab auch einen Logikfehler, wenn man solch eine Regel überschreibt.
hoffe jetzt ist es richtig.


habe in diesem Zusammenhang eine Frage an @Ingmar

wenn man in der Admin die Containergröße definiert, warum tauchen dann die Werte nicht in styles.css auf?


oder anders gefragt, wo wirken sich die Angaben "Maximale Breite der Inhalte" aus?





... würde es „Fussball spielen” heissen

vG Bernd‍

 Antworten

 Beitrag melden
07.06.2024 11:19
avatar  Ina-Dui
#10 RE: Ränder mobiles Layout zu breit
avatar
Mitglied

Herzlichen Dank. Jetzt hat es funktioniert. Sieht viel besser aus.


 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!