WebSite X5Help Center

 
Salvatore M.
Salvatore M.
User

Come rendere un testo fluido  it

Author: Salvatore M.
Visited 1457, Followers 1, Shared 0  

ho notato che Per rendere il testo fluido dovremmo abbandonare i pixel ed utilizzare le misure relative ems per due buoni motivi: primo perché ci permette di superare i problemi di IE con i font settati in px;

Secondo perchè con questa operazione il testo diventa fluido, cioè si adatta alla larghezza del contenitore

facciamo un esempio del layout fisso settando il font a 16px; per trasformarlo in misura relativa, settiamo il testo nel “body” al 100% in modo che tutti gli elementi della pagina possano essere considerati in maniera relativa rispetto alla misura di default del browser che di solito è di 16px

come possiamo applicarlo alla versione websitex5 Pro v13.1

Posted on the
29 ANSWERS
Incomedia
Riccardo P.
Incomedia

Buongiorno Salvatore,

purtroppo automaticmanete non è possibile. Riducendo la finestra del browser se hai settato il mobile noterai che nell'ultimo breackpoint il testo si adatta già alla finestra e la cella si riduce. Per le altre visualizzazioni invece devi sempre settare una dimensione fissa così che le celle si adattino a quella risoluzione.

Puoi però provare a inserire degli script o codice personale per realizzare quello che dici, setta il topic come pubblico così da ricevere maggiori informazioni che a da altri utenti della community.

Read more
Posted on the from Riccardo P.
Salvatore M.
Salvatore M.
User
Author

Buongiorno Riccardo,

come faccio a settare una dimensione fissa

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

Buongiorno

ho provato ma non funziona

<style> @media screen and (max-width: 719px) { * {font-size:12px !important;} } </style>

pannello Esperto | codice personalizzato | prima della chiusura di HEAD

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... hai personalizzato i valori...?...

...!... LINK ...?...

.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

Si ho personalizzato i valori

Scusami KoAsim

come faccio a creare un link per un sito non finito se me lo spieghi gentilmente

ti ringrazio e ne farò sempre uso

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... quando sperimenti, dovresti pubblicare le tue prove in rete per una verifica reale, coma fanno per la maggiora altri utenti, prendendo per esempio uno spazio web su altervista, oppure esportando in una sotto directory del sito che si ha in uso...

... senza vedere, tutto può essere, specialmente quando di stratta di personalizzazioni extra dal programma...

.



Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

ok Grazie!!

 provo con altervista

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

ma una domanda nel frattempo... questa stringa e giusta così

<style> @media screen and (max-width: 719px) { * {font-size:12px !important;} } </style>

o devo aggiungere dell'altro

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... sì, ... da inserire nel pannello ESPERTO /HEAD

... dovrebbe attivare la modifica per tutti i testi della pagina, sotto alla larghezza di 720 pixel, e rendendoli tutti uguali a 12px

... i valori di larghezza li puoi rendere congrui al  breakpoint che vuoi considerare, e la misura del font la puoi diminuire o aumentare per quel che serve a te...

...  per provare basta un click, riduci la finestra del browser e vedi cosa accade nella pagina...

.



Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

Si funziona grazie!!!

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

Buongiorno grazie ancora KolAsim

e se desidererei diverse dimensioni di carattere per ogni dimensione di struttura

<style> @media screen and (max-width: 719px) { * {font-size:12px !important;} } </style>

<style> @media screen and (max-width: 599px) { * {font-size:10px !important;} } </style>

<style> @media screen and (max-width: 479px) { * {font-size:9px !important;} } </style>

le stringhe sono giuste così?

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... si, OK; dovrebbero corrispondere ai vari breakpoint, e potresti raggrupparli così:

<style>
@media screen and (max-width: 719px) { * {font-size:12px !important;} }
@media screen and (max-width: 599px) { * {font-size:10px !important;} }
@media screen and (max-width: 479px) { * {font-size:9px !important;} }
</style>

... considera che l'occhio umano è sempre lo stesso, e tu riduci il punto font col rimpicciolirsi della finestra...

.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

Grazie per l'aiuto KolAsim

 Buona giornata!

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

Buongiorno KolAsim

e se vorrei che il contenuto della pagina possa avere una dimensione diversa del Footer

ad esempio nel contenuto della pagina 12px nel Footer 8px

posso usare la stessa stringa e raggrupparli così?

<style>
@media screen and (max-width: 719px) { * {font-size:12px !important;} }
@media screen and (max-width: 599px) { * {font-size:10px !important;} }
@media screen and (max-width: 479px) { * {font-size:9px !important;} }
</style>

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... se il tuo footer si chiama  imFooter  ... e lo vuoi escludere, ... forse! prova così:

<style>
@media screen and (max-width: 719px) { *:not(#imFooter) {font-size:12px !important;} }
@media screen and (max-width: 599px) { *:not(#imFooter) {font-size:10px !important;} }
@media screen and (max-width: 479px) { *:not(#imFooter) {font-size:9px !important;} }
</style>

.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

Cosa vuoi dire con la frase ....."se il tuo footer si chiama  imFooter" 

cmq Così non funziona non ho imFooter

Read more
Posted on the from Salvatore M.
Claudio D.
Claudio D.
Moderator
Best User of the month IT

...allora metti il link del sito online ...

...cosa che sarebbe da fare sempre per essere aiutati meglio ...

Read more
Posted on the from Claudio D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Salvatore M.
... ... ...cmq Così non funziona non ho imFooter

... se non funziona, usa altre regole a seguire, oppure fanne a meno...

... senza programma di più non posso immaginare...

.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

Buongiorno Claudio

Come vedi dal mio profilo non ho molta esperienza non so come postare il sito online senza cancellare quello originale

ho provato come dice KolAsim a prendere uno spazio web su altervista, ma non so come postare il mio sito provvisoriamente per testarlo

o provato anche ad esportare  in una sotto directory del sito che e in uso... avevo creato la cartella test

ma non so come arrivarci perchè mi da pagina irragiungibile, scusatemi per la mia ignoranza ma non so come fare

se gentilmente non mi spiegate passo passo...ho provato anche a documentarmi su internet per come fare ma non mi dà le risposte che desidro, Sicuramente sbaglio io

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

Buongiorno!

KolAsim e Claudio D.

sono riuscito a pubblicarlo su altervista

ecco il link

http://carfast66.altervista.org/

i problemi compaiono quando riduco sotto 719 px i consigli di KolAsim sono molto buoni per mantenere il testo del

Footer fisso.. ma riduce anche il testo della pagina che dovrebbe rimanere leggibile anche se leggermente ridotto

Read more
Posted on the from Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Salvatore M.
... ... ... ma riduce anche il testo della pagina che dovrebbe rimanere leggibile anche se leggermente ridotto... ...

... come detto inizialmente, riguarda tutta la pagina...

 ‪ KolAsim ‪ ‪
... ... ... dovrebbe attivare la modifica per tutti i testi della pagina, sotto alla larghezza di 720 pixel, e rendendoli tutti uguali a 12px ... ... ...

.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Author

si ok ho capito KolAsim

spero che con le prossime release mettono a posto la gestione carattere

separata in base ai vari breakpoint...

Grazie per l'aiuto

Read more
Posted on the from Salvatore M.
Claudio D.
Claudio D.
Moderator
Best User of the month IT

...non è una cosa da "correggere" ... se vuoi puoi farne richiesta come aggiunta per le prossime versioni aprendo un nuovo post di tipo "IDEA"

Read more
Posted on the from Claudio D.
Salvatore M.
Salvatore M.
User
Author

ci sono riuscito era  solo da modificare il file

originale non funzionava

@media screen and (max-width: 719px) { *:not(#imFooter) {font-size:12px !important;} }

modificato funziona

@media screen and (max-width: 719px) { *:yes(#imFooter) {font-size:12px !important;} }

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

si lo so volevo dire che sarebbe una cosa da aggiungere alle nuove versioni

ok grazie anche a te Claudio D.

Read more
Posted on the from Salvatore M.
 lemonsong  
 lemonsong  
User
Salvatore M.
modificato funziona @media screen and (max-width: 719px) { *:yes(#imFooter) {font-size:12px !important;} }

Consiglio di dare un'occhiata ai selettori CSS attuali, :yes() non esiste.

Read more
Posted on the from  lemonsong  
Salvatore M.
Salvatore M.
User
Author

lemonsong 

grazie per la correzzione!!

Read more
Posted on the from Salvatore M.
Salvatore M.
Salvatore M.
User
Author

Buongiorno

Ora il sito con questi problemi si trova all'indirizzo

www.extrogrillcafe.it

Se avete consigli o suggerimenti...vi ringrazio anticipatamente.

Buona giornata

Read more
Posted on the from Salvatore M.