Joomla.it Forum
Joomla! 3 => Joomla! 3 => : Valentina Amadio 19 Feb 2018, 17:39:52
-
Salve a tutti...
linko il mio sito e vi spiego il problema..
link (http://www.gdpmedical.com/demojoomla/index.php/it/medical-services)
Praticamente se provate a cliccare su ispeziona e mettere come modalità di visualizzazione iPad, e metto ruota orizzontalmente viene il menù su 2 righe e non solo su una, come dovrebbe essere.. come posso fare per risolvere questo problema? e perche non viene fuori la tripla riga dell' offcanvas?
Grazie mille,
Valentina
-
Praticamente se provate a cliccare su ispeziona e mettere come modalità di visualizzazione iPad, e metto ruota orizzontalmente viene il menù su 2 righe e non solo su una, come dovrebbe essere..
Dipende dal numero delle voci di menu (parecchie), dal numero di caratteri di ciascuna voce e dalla dimensione del font utilizzato nel menu.
In sostanza: dai 1199px di risoluzione orizzontale fino ai 991px (che è quando compare il menu mobile in offcanvas) il tuo menu va inevitabilmente su due righe.
come posso fare per risolvere questo problema?
Se non puoi ridurre il numero delle voci principali del menu, o "accorciarle" ("what we are and what we do" è davvero lunghissima...), devi agire sulla dimensione del font.
E potresti agire usando le media queries, il che significa dire ai browser che dai 1199px ai 991px la dimensione del font del menu deve passare dagli attuali 12px a 10px (puoi usare anche un valore percentuale, e 75% mi pare sia corretto).
Questo a meno che tu non voglia ridurre le dimensioni del font a tutte le risoluzioni, quindi anche a quelle superiori al momento in cui il menu appare su due righe...
e perche non viene fuori la tripla riga dell' offcanvas?
Il break point per la comparsa del menu offcanvas è settato a 991px. Sopra avrai il menu da desktop.
-
Ciao,
come dice Limma (ciao Limma :) )
Puoi anche mettere questo nel file custom, dovrebbe bastare:
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
padding: 0 10px;
letter-spacing: 0;
}
-
Puoi anche mettere questo nel file custom, dovrebbe bastare:
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
padding: 0 10px;
letter-spacing: 0;
}
Molto più rapida e semplice della soluzione da me prospettata...!
Ma è un po' che ho il trip delle media queries... ;D
Ciao adottauncane :D
-
Wow.. perfetto!
[/size]Grazie mille Limma e Adottauncane.. come sempre siete perfetti :D
[/size]Buona giornata!!