WebSite X5Help Center

 
Salvatore M.
Salvatore M.
User

Come rendere un testo fluido  it

Autore: Salvatore M.
Visite 1310, Followers 1, Condiviso 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

Postato il
29 RISPOSTE
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.

Leggi di più
Postato il da Riccardo P.
Salvatore M.
Salvatore M.
User
Autore

Buongiorno Riccardo,

come faccio a settare una dimensione fissa

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da Salvatore M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

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

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

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da 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...

.



Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

ok Grazie!!

 provo con altervista

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da 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...

.



Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

Si funziona grazie!!!

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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ì?

Leggi di più
Postato il da 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...

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

Grazie per l'aiuto KolAsim

 Buona giornata!

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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>

Leggi di più
Postato il da 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>

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

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

cmq Così non funziona non ho imFooter

Leggi di più
Postato il da Salvatore M.
Claudio D.
Claudio D.
Moderator
Utente del mese IT

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

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

Leggi di più
Postato il da 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...

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da 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 ... ... ...

.

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
Salvatore M.
Salvatore M.
User
Autore

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

Leggi di più
Postato il da Salvatore M.
Claudio D.
Claudio D.
Moderator
Utente del mese IT

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

Leggi di più
Postato il da Claudio D.
Salvatore M.
Salvatore M.
User
Autore

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;} }

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

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

ok grazie anche a te Claudio D.

Leggi di più
Postato il da 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.

Leggi di più
Postato il da  lemonsong  
Salvatore M.
Salvatore M.
User
Autore

lemonsong 

grazie per la correzzione!!

Leggi di più
Postato il da Salvatore M.
Salvatore M.
Salvatore M.
User
Autore

Buongiorno

Ora il sito con questi problemi si trova all'indirizzo

www.extrogrillcafe.it

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

Buona giornata

Leggi di più
Postato il da Salvatore M.