sito responsive - problema su smartphone

[Eliafoschi]

Buongiorno, avrei bisogno di aiuto per risolvere un problema sul mio sito (www.puntopostura.it).
Nella home del sito ho inserito una frase utilizzando un font caricato e non presente in origine.
ho dettato le impostazioni responsive e tale scritta viene ridimensionata su tutti i dispositivi ad eccezione degli smartphone (portrait).
non riesco a risolvere il problema, qualcuno ha idea di dove possa essere l'errore?
grazie a tutti per la collaborazione
elia

[Limma]

Ho dato una veloce occhiata alla scritta incriminata e credo che il problema stia nel codice inline che hai utilizzato per il paragrafo:

Codice: [Seleziona]

style="margin-left: 70px; margin-right: 70px; margin-top: 80px; text-align: justify;"A quanto vedo, fino a 440px di larghezza il testo è leggibile (anche se il text-align: justify crea dei bruttissimi e inutili spazi tra le parole, a mio parere...), mentre al di sotto iniziano i problemi, problemi dovuti principalmente ai margin right e left che hai impostato.
In realtà crea qualche problema anche il codice inline che hai inserito nel tag span all'interno del tag p:

Codice: [Seleziona]

style="font-family: maxwellregular; letter-spacing: 3px; font-size: 30pt; line-height: 40px; color: #000000;"Con lo smartphone in modalità portrait, il letter-spacing a 3px è complice del problema, e anche il font-size contribuisce al tutto.
Cosa fare?
Una soluzione potrebbe essere questa:

Codice: [Seleziona]

@media only screen and (max-width: 440px) {
  .frase {
       margin-left: auto !important;
        margin-right: auto !important;
        text-align: left !important;
    }
}La classe "frase" va applicata al tag <p> che contiene il tag <span> dentro al quale c'è la fatidica frase.

[Eliafoschi]

Grazie per la risposta. Se puoi ancora un aiuto:


questo è il codice sorgente della HOME:



<p style="margin-left: 70px; margin-right: 70px; margin-top: 80px; text-align: justify;"><span style="font-family: maxwellregular; letter-spacing: 3px; font-size: 30pt; line-height: 40px; color: #000000;"><span class="caption">"Nelle posture e nell'atteggiamento che assume in ogni suo gesto, il corpo parla un linguaggio che trascende l'espressione verbale. Non è la mente che va in collera né il corpo che colpisce: è l'individuo nella sua totalità che si esprime."</span></span></p>
<p class="caption" style="margin-left: 70px; text-align: justify;"><span style="font-size: 36pt; color: #000000;"> </span></p>
<p class="caption" style="margin-right: 70px; text-align: right;"><span style="font-family: maxwellregular; font-size: 30pt; letter-spacing: 3px; color: #000000;">Alexander Lowen.</span></p>
<p class="caption" style="margin-right: 70px;"> </p>
<p class="caption" style="margin-right: 70px;"> </p>
<p class="caption" style="margin-right: 70px; text-align: left;"> </p>


Come dovrei modificarlo in base a quanto mi hai scritto?
Grazie mille e scusa ma non sono molto pratico!

[Eliafoschi]

Nessuno riesce ad aiutarmi con questo mio ultimo problema? Grazie!!