WebSite X5Help Center

11 ANSWERS
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... purtroppo senza vedere non posso immaginare; ...cosa intendi per responsive...!?...
... forse non ho capito cosa intendi, ma ho fatto una rapida prova con l'icona stellina, e si adatta al layout in tutte le risoluzioni:...
.
ciao
.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Roberto M.
Roberto M.
User

Separator è uno dei pochi oggetti realmente responsive. Non è che per caso fai riferimento a Simple separator?  

Read more
Posted on the from Roberto M.
Domenico B.
Domenico B.
User
Author

Ragazzi Separator e questo 
Con le icone o immagini è ok, ma con il testo no, no taglia

Read more
Posted on the from Domenico B.
Domenico B.
Domenico B.
User
Author

*lo taglia

Read more
Posted on the from Domenico B.
Roberto M.
Roberto M.
User

Hai ragione Domenico. Nel sito da te postato non mi da problemi di taglio ma ho fatto delle prove su una pagina test ed effettivamente coi testi oltre i 36PX taglia la scritta. Solita anomalia segnalata e ri-segnalata non solo per questo oggetto ma per TUTTO. Solo con codice extra riesci a migliorare oppure devi centellinare la grandezza del testo facendo delle prove. Io non ho mai utilizzato questo separatore per delle scritte e questo mi ha indotto in errore in quanto come da te stesso precisato, con immagini e icone è OK.

Read more
Posted on the from Roberto M.
Roberto M.
Roberto M.
User

Nel tuo caso applica questo codice NON unico e NON esclusivo. Copia e incolla nelle proprietà della pagina il seguente listato.

<style>

#pluginAppObj_53 .separator-text {
white-space: nowrap;
font-size: 48px; /* dimensione desktop */
overflow: visible;
}

/* SOLO su schermi piccoli */
@media (max-width: 600px) {
#pluginAppObj_53 .separator-text {
font-size: clamp(14px, 6vw, 32px); /* si riduce solo su mobile */
}
}

</style>

=============

Cosa abbiamo fatto?

  • 48px su desktop → sempre, senza riduzioni.
  • Sotto 600px:
    • clamp() riduce gradualmente il font:

      • minimo 14px

      • massimo 32px

      • valore fluido basato su viewport (6vw)

Il testo rimane sempre su una riga, senza tagli. Puoi abbassare il valore minimo ►:font-size: clamp(10px, 5vw, 32px);

#pluginAppObj_53 .separator-text è il tuo ID.

Fammi sapere se è andato tt ok.

Read more
Posted on the from Roberto M.
Giancarlo B.
Giancarlo B.
User
Best User of the month IT
Roberto M.
Nel tuo caso applica questo codice NON unico e NON esclusivo.

... laughing

Read more
Posted on the from Giancarlo B.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Domenico B.
qui trovate il separatore https://www.eddielang.it/

... ah! per il testo! ... ...comunque nessun problema nel tuo LINK, (...se non di controllare altri fattori più importanti sotto 1200px...)...
... per il separatore con testo penso che basti fare delle prove per sapersi regolare di conseguenza, come del resto si fa per tutte le altre cose...
...  per certi problemi minimi sono previsti pannelli per personalizzare con semplicità e facilità, nel caso aiuta fare  una domanda a Tema nel HelpCenter...
... per esempio per tale oggetto separator è prevista la relativa scheda "Codice" che si presenta per esempio in questo modo:
#pluginAppObj_3_08 {
}
... per rendere il relativo testo elastico, per tutte le risoluzioni, se proprio lo si vuole(!), basta personalizzare il codice proposto, così:
#pluginAppObj_3_08 * {
font-size:4vw !important;
}
... se invece vuoi che l'effetto elastico si attivi solo sotto al tuo penultimo breakpoint (720px), allora modifica così:
@media (max-width: 720px) {
#pluginAppObj_3_08 * {
font-size:4vw !important;
}}
.... un paio di prove per sistemare ad hoc e il gioco è fatto...
.


ciao 
.
.

Read more
Posted on the from  ‪ KolAsim ‪ ‪
Roberto M.
Roberto M.
User

Ciao Domenico. Con il codice che ti ho proposto, mantieni 48PX fino a quando non incontra il media query che opera dai 600px a scendere poi fai tu. Questo è un codice che si può scrivere in tanti modi diversi bisognerebbe sapere cosa esattamente ti serve.

Io sono andato per logica della serie: Testo originale fino ad un certo punto e poi ridimensionato, non adattato e non elastico.Parlo di responsive.

Devi sempre calcolare in programmazione vwè un’unità di misura CSS che significa viewport width, cioè percentuale della larghezza dello schermo.

  • 1vw = 1% della larghezza dello schermo
  • 4vw = 4% della larghezza dello schermo

Quindi:

  • Se lo schermo è largo 1000px, 4vw = 40px
  • Se lo schermo è largo 400px, 4vw = 16px

Usare vw (come tanti suggeriscono) è un modo valido per rendere il testo elastico e responsive, ma non hanno ragione sulla soluzione migliore per un cliente, perché:

  • il codice rende il testo elastico sempre, anche su desktop
  • questo può creare testi enormi su monitor grandi
  • non rispetta il design originale
  • non è controllato né elegante

===================

Con il tuo ID preso dal sito in evidenza:

<style>

#pluginAppObj_53 .separator-text {
white-space: nowrap;
font-size: 48px; /* dimensione desktop */
overflow: visible;
}

/* SOLO su schermi piccoli */
@media (max-width: 600px) {
#pluginAppObj_53 .separator-text {
font-size: clamp(14px, 6vw, 32px); /* si riduce solo su mobile */
}
}

</style>

Ora non resta che regolarti.wink

Read more
Posted on the from Roberto M.
Domenico B.
Domenico B.
User
Author

Grazie Mille! sono tutte perfettamente funzionanti! le o applicate e funzionano benissimo! 
Grazie mille Roberto e KolAsim ‪ ‪! 

Read more
Posted on the from Domenico B.