Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it L'avatar di eee
    Registrato dal
    Nov 2002
    Messaggi
    127

    Centrare div verticalmente in un div la cui altezza e' sconosciuta

    Ciao,

    vorrei centrare verticalmente un div in un altro div la cui altezza e' sconosciuta perché dovrebbe adattarsi a quel che resta dello schermo. Ho provato varie cose, ma nessuna sembra funzionare...

    Potete aiutarmi?

  2. #2
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,654
    Ciao, potresti provare usando display:flex . Ci sono diverse opzioni fra cui il centramento verticale.

  3. #3
    Utente di HTML.it L'avatar di eee
    Registrato dal
    Nov 2002
    Messaggi
    127
    Grazie,

    usando flex l'allineamento verticale centrato funziona, ma solo se do una dimensione fissa in pixel al parent. Dando un colore di sfondo al parent mi sono resa conto che il vero problema e' che il parent non si espande per estendersi al 100% dello spazio rimanente della pagina (la cui dimensione dipender�' dal tipo di mobile usato), questo credo sia il vero motivo per cui non riesco ad ottenere la centratura.

    Questo e' il codice CSS:

    codice:
    .verical_align {
        background-color:#FF0000;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    
    #linkedin {
        width: 35px;
        height: 35px;
        display: block;
        overflow: hidden;
    
    
    }



    La pagina e' qui, il div incriminato e' all'interno del menu nella dimensione mobile.

  4. #4
    Utente di HTML.it L'avatar di eee
    Registrato dal
    Nov 2002
    Messaggi
    127
    Ho anche un'atra domanda riguardo alla compatibilità' di flex, nella guida dice che "display: flex" non e' compatibile con Explorer 10 e che bisognerebbe usare "display: flexbox", ma se uso flexbox non funziona ne su Firefox ne su Safari!

  5. #5
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,654
    Potresti calcolare e settare le distanza con javascript(jquery piu facilemente per settare il marigine).
    Oppure con togliendo display:flex e aggiungendo
    codice:
     margin:calc(30%) auto 
    vedo che bene o male si centra.

    PS
    flex o flexbox a seconda del browser funzioneranno o meno. Non vuol dire che devi eslcudere una regola o l'altra.
    Puoi usare i prefissi a seconda del browser come vedi negli esempi qui
    -webkit-flex, -ms-flex

  6. #6
    Utente di HTML.it L'avatar di eee
    Registrato dal
    Nov 2002
    Messaggi
    127
    Jquery non lo so usare, ho provato con

    codice HTML:
     margin:calc(30%) auto
    ma questo fa apparire la barra verticale quando non e' necessaria, e questo lo vorrei evitare!

    Mi sa che gli mettero un padding fisso! Tra le opzioni mi sembra la migliore anche se non era proprio quello che volevo!

    Grazie dell'aiuto

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 © 2024 vBulletin Solutions, Inc. All rights reserved.