Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    Centratura verticale immagini portrait

    Ciao,
    Sono un po' arrugginito...


    Ho questa struttura:

    codice:
    <div>
      <a href="">
        <figure>
          <img src="" alt="" />
        </figure>
      </a>
    </div>

    Il figure ha dimensione fissa 150 x 100.
    Le img però possono essere sia orizzontali che verticali.
    Come faccio a centrarle verticalmente croppando la parte superflua?

  2. #2
    Moderatrice di CSS L'avatar di ResianTaxidrive
    Registrato dal
    Oct 2007
    residenza
    Udine
    Messaggi
    2,766
    Forse il modo più semplice e cross browser è caricare le immagini come background e impostare a center il background position.

    Altrimenti dovresti usare il crop per tagliare una porzione di immagine ma se hai una varietà di grandezze, non so se ti funziona.

  3. #3
    Grazie, ho risolto. Effettivamente è un metodo che non conoscevo

    .element {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    }

    http://zerosixthree.se/vertical-alig...-lines-of-css/

  4. #4
    Moderatrice di CSS L'avatar di ResianTaxidrive
    Registrato dal
    Oct 2007
    residenza
    Udine
    Messaggi
    2,766
    ma non dovevi anche tagliare l'immagine?

  5. #5
    Quote Originariamente inviata da ResianTaxidrive Visualizza il messaggio
    ma non dovevi anche tagliare l'immagine?
    Per quello uso semplicemente un overflow:hidden

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