Visualizzazione dei risultati da 1 a 7 su 7
  1. #1
    Utente di HTML.it
    Registrato dal
    Jul 2017
    Messaggi
    4

    Allineare due elementi orizzontalmente

    Salve a tutti,

    Premetto che sono un novizio di css e costruisco siti ancora su una base wordpress usando temi e visual composer. Sto però cominciando a personalizzare passo passo tramite css. Spero non mi crocifiggiate per la mia impurità .

    Su questa pagina: http://www.headshotweddings.com/2017/07/13/74-2-2/

    Sto impazzendo cercando di far essere il video della stessa larghezza delle foto che seguono. Targhettandolo in custom css riesco a rimpicciolirlo ma sta un po sulla destra e non centrato rispetto alla foto.

    Soluzioni?

    Grazie!

    T

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Ciao e benvenuto, ho dato uno sguardo rapido a quella pagina ma non ho visto il problema che descrivi.
    Il video lo vedo comunque più piccolo rispetto alla dimensione delle immagini (da quel che ho visto è impostato al 70% del contenitore); da quello che hai indicato non capisco se hai difficoltà ad impostare la dimensione del video, per portarla alla stessa delle immagini, oppure se lo hai già fatto ma hai però il problema nell'allineamento.

    Riguardo l'allineamento ho provato a smanettare sul css dalla console, e ho notato in effetti che per risoluzioni alte si crea un margine di 10px a destra delle immagini (nello specifico, affianco all'elemento <a> che contiene l'immagine).
    Questa la regola:
    codice:
    .foogallery-default.spacing-width-10 a {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    La questione sembra quindi dipendere non dal video ma piuttosto da qualche impostazione di tale "foogallery" per cui è applicato quel margine.

    Non so se questo possa riguardare il problema che descrivi; eventualmente dal tuo wp prova a controllare le impostazioni di tale galleria o ad aggiungere qualcosa sul css personalizzato in modo da riportare a 0 quel margine.

    Se non è questo il problema, fornisci eventualmente maggiori dettagli per poterlo inquadrare meglio.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Utente di HTML.it
    Registrato dal
    Jul 2017
    Messaggi
    4
    Ciao e grazie della risposta!!

    è esattamente quello il problema!

    il video per ora l'ho messo al 70% perché si notava meno il disallineamento.

    Non riesco a trovare nessuna impostazione per levare quel margine, ed ho provato banalmente a mettere in custom css:

    .foogallery-default.spacing-width-10 a {
    margin
    -right:0px;
    margin
    -bottom:0px;
    }ma non ha alcun effetto.

    tra l'altro ho anche dimenticato come settare la larghezza del video uguale a quella delle foto... mi potresti aiutare anche con quella?

    di che altre informazioni avresti bisogno?

    Grazie ancora,

    Tameto

  4. #4
    Utente di HTML.it
    Registrato dal
    Jul 2017
    Messaggi
    4
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Ciao e benvenuto, ho dato uno sguardo rapido a quella pagina ma non ho visto il problema che descrivi.
    Il video lo vedo comunque più piccolo rispetto alla dimensione delle immagini (da quel che ho visto è impostato al 70% del contenitore); da quello che hai indicato non capisco se hai difficoltà ad impostare la dimensione del video, per portarla alla stessa delle immagini, oppure se lo hai già fatto ma hai però il problema nell'allineamento.

    Riguardo l'allineamento ho provato a smanettare sul css dalla console, e ho notato in effetti che per risoluzioni alte si crea un margine di 10px a destra delle immagini (nello specifico, affianco all'elemento <a> che contiene l'immagine).
    Questa la regola:
    codice:
    .foogallery-default.spacing-width-10 a {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    La questione sembra quindi dipendere non dal video ma piuttosto da qualche impostazione di tale "foogallery" per cui è applicato quel margine.

    Non so se questo possa riguardare il problema che descrivi; eventualmente dal tuo wp prova a controllare le impostazioni di tale galleria o ad aggiungere qualcosa sul css personalizzato in modo da riportare a 0 quel margine.

    Se non è questo il problema, fornisci eventualmente maggiori dettagli per poterlo inquadrare meglio.
    Continuando a smanettare, su questa pagina stavolta: http://www.headshotweddings.com/2017/07/14/74-2-2-2/

    mi accorgo che il video si sposta un po a destra quando in css gli assegno un'ampiezza fissa (di 1024) con

    codice:
    .vydeo {
    width: 1024px;
    }
    Il video diventa largo come le foto ma si sposta a destra. In realtà il disallineamento delle foto non lo avverto e non ne ho viste tracce.

    Tra l'altro inserendo quel codice il player del video non è più responsive.

    Grazie dell'aiuto.

    Tameto

  5. #5
    Utente di HTML.it
    Registrato dal
    Jul 2017
    Messaggi
    4
    ho risolto lasciando la dimensione del video a 100% e dando 60px di padding a destra e sinistra di tutta la colonna.

  6. #6
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Quote Originariamente inviata da Tameto
    ho risolto
    Ciao, non ho avuto modo di risponderti ma mi fa piacere che nel mentre sei riuscito a risolvere.
    Buon proseguimento.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  7. #7
    Ciao
    prova a leggere questo articolo:

    http://www.extrowebsite.com/blog/pos...e-display-flex

    Spero possa esserti utile

    Saluti
    =================
    www.extrowebsite.com

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.