Visualizzazione dei risultati da 1 a 3 su 3

Discussione: Correggere posizione social-bar che copre l'icona del menu e ne impedisce il click

  1. #1

    Correggere posizione social-bar che copre l'icona del menu e ne impedisce il click

    Buongiorno a tutti, mi chiamo Stefano e sono nuovo nel forum. Spero di poter imparare molto da qui!

    Premetto, so usare discretamente wordpress, parallelamente sono una capra totale per quanto riguarda il css.
    Ho quasi ultimato lo sviluppo del mio sito aziendale, ma non riesco a venire a capo all'ultimo problema. Spero possiate aiutarmi a risolverlo.
    il sito bozza è http://viaintbozza.altervista.org
    Nell'Header ho inserito i link social FB Linkedin con il plugin addthis. In modalità desktop non è centrato ma diciamo che può andar bene, in modalità mobile quel plugin si sovrappone al menù ridotto, per tanto mi è impossibile cliccarlo.

    Qualcuno può suggerirmi "la riga" di codice css da poter modificare, per lasciare il plugin nell'header affinchè nello scroll della pagina rimanga sempre in vista, ma sotto la fine del menu?

    Allego un immagine di quello che ho e del risultato che vorrei ottenere
    IMG_0108.jpg

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    3,784
    Ciao Stefano, benvenuto. La situazione è un po' complessa. Il codice CSS che gestisce quegli elementi è incluso direttamente nella pagina ed è "minimizzato" (cioè nel codice sorgente della pagina appare in un'unica riga) per cui è tecnicamente impossibile dirti la riga specifica, perché tutto quel CSS sta esattamente nella riga 1 (in quanto si tratta di un'unica riga).

    Non so come ti viene mostrato (se ti viene mostrato) sul pannello di amministrazione e se tu riesci quindi a modificarlo. Ad ogni modo dovresti cercare, in quel CSS, il selettore .at4-follow sotto il quale sono definite le seguenti proprietà:
    codice:
    .at4-follow {
        position: fixed;
        top: 0;
        right: 0;
        font-weight: 400;
        color: #666;
        cursor: default;
        z-index: 10001;
    }
    La classe .at4-follow è sostanzialmente quella usata per definire l'elemento contenitore di quei social-link.

    Ovviamente puoi risolvere in vari modi, ad esempio puoi spostare l'intero elemento il tanto che basta a scoprire l'hamburger-menu.

    In quel blocco di CSS puoi quindi modificare il valore della proprietà right (che ora è 0) con 50px; tieni conto che questo è il minimo valore utile ad evitare la sovrapposizione dei due elementi in questione, considerando le diverse impaginazioni stabilite per i vari breakpoint in cui compare appunto l'icona del menu (in diverse dimensioni) e considerando il padding usato nel contenitore più interno dei social-link - potrà sembrarti arabo ma prendilo per buono - per cui se ti interessa avere uno "spostamento" minore di quei 50px dovrai necessariamente apportare delle ulteriori modifiche.

    Intanto vedi se riesci ad apportare quella modifica e se così ti può andare bene; fai sapere.




    [Mod]
    Ti invito cortesemente a (ri)leggere con attenzione il regolamento di sezione (ogni sezione ne ha uno che puoi trovare come discussione in evidenza). In particolare, occhio hai titoli.

    Consiglio su riga di codice css
    Quando si aprono delle discussioni tecniche è richiesto l'uso di titoli esplicativi. Quello che hai usato qui è un titolo alquanto generico per il quale sarebbe prevista la chiusura della discussione stessa ma, essendo tu un nuovo iscritto, per questa volta provvedo io a modificarlo. Ti invito a fare maggiore attenzione in futuro. Grazie!
    [/Mod]
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 15% tra i post del forum; il 9% sul web.
    Ti resta l’1% ... usalo bene!

    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

  3. #3
    Ciao KillerWorm, intanto ti ringrazio per la risposta e chiedo scusa per l'errore nel titolo.
    (Perdona l'incompetenza) ho chrome, ho fatto tasto destro ispeziona sul logo di facebook e mi ha aperto il menu in basso.ho trovato il menu di cui mi parli:
    .at4-follow {
    position: fixed;
    top: 0;
    right: 0;
    font-weight: 400;
    color: #666;
    cursor: default;
    z-index: 10001;
    }
    top: 0 è segnato.
    Devo per forza spostare il plugin verso il basso e non verso destra altrimenti mi copre il menu nella finestra ridotta del desktop

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2018 vBulletin Solutions, Inc. All rights reserved.