2015-02-18 15 views
7

Ho un jsfiddle qui - http://jsfiddle.net/gh4Lur4b/8/Bootstrap altezza cambiamento carosello

E 'una larghezza carosello di bootstrap.

Mi piacerebbe cambiare l'altezza e mantenerla a tutta larghezza.

È l'altezza determinata dall'altezza dell'immagine.

Come è possibile modificare l'altezza della giostra e mantenerla al 100% della larghezza.

.carousel-inner{ 
     // height: 300px; 
    } 

    .item, img{ 
     height: 100% !important; 
     width: 100% !important; 
     border: 1px solid red; 
    } 

risposta

14

Il seguente dovrebbe funzionare

.carousel .item { 
    height: 300px; 
} 

.item img { 
    position: absolute; 
    top: 0; 
    left: 0; 
    min-height: 300px; 
} 

JSFille per riferimento.

+0

Questo non modifica le dimensioni dell'immagine. La giostra cambia dimensione ma non l'immagine. Penso che speravo in qualcosa di simile a "background-size: cover;" così l'immagine si estende http://jsfiddle.net/gh4Lur4b/17/ – ttmt

+0

Oh capisco cosa intendi. Scusa, non è stato chiaro dalla tua domanda iniziale. Si prega di consultare la mia risposta aggiornata. –

+0

Ma ora l'immagine viene schiacciata quando la finestra viene ridotta. Nel jsfiddle quando la finestra è ingrandita l'immagine non viene allungata ma si espande. Ho bisogno di un effetto simile quando la finestra è ridotta. – ttmt

Problemi correlati