2013-08-22 18 views
5

Quando riduci il browser a una larghezza di 1000 pixel, c'è una barra di scorrimento orizzontale, c'è un modo per rimuoverlo sopra 1000px? Controlla il mio screendump qui sotto.Rimuovi la barra di scorrimento come overflow nascosta ma deve essere visibile

Ho provato un clearfix ma questo non ha aiutato e ha provato l'overflow: visibile;

.clearfix:before, 
.clearfix:after { 
    content: ".";  
    display: block;  
    height: 0;  
    overflow: hidden; 
} 
.clearfix:after {clear: both;} 
.clearfix {zoom: 1;} /* IE < 8 */ 

Un modo semplice e pulito per risolvere questo problema con CSS?

+1

Non ho la domanda, cosa intendi con "rimuovi questo sopra 1000px"? La barra di scorrimento scompare automaticamente se la finestra diventa più larga di 1000 pixel. –

+1

possibile duplicato di [larghezza del corpo grande senza barra di scorrimento orizzontale] (http://stackoverflow.com/questions/15005225/large-body-width-without-horizontal-scrollbar) –

+0

Controlla il mio screendump, le mie immagini devono essere visibili, ma la pergamena deve avere una larghezza di 1000 pixel, quando ho un browser a 1020 px di larghezza, ottengo una barra di scorrimento. Deve essere come le immagini di sfondo. overflow: hidden sarebbe normalmente ok, ma le immagini devono essere visibili. Overflow nascosto rimuove lo scroll, overflow visibile non :( – user123

risposta

5
@media all and (min-width: 1000px) { 
body { 
    margin:0; 
} 
.wrapper { 
    overflow-x: hidden; 
    } 
} 

Se il browser è più largo di 1000 pixel, non ci sarà scorrimento orizzontale.

+0

hmm, stupido non ci hai pensato, potrebbe essere una soluzione. Grazie per quello. Mi chiedo ancora se c'è un altro modo per farlo con i CSS. Dovrebbe essere media larghezza massima 1000 px? Quindi, tutti sotto 1000 px, verrà impostato l'overflow nascosto. – user123

+0

sei corretto, ho usato un altro metodo che mi piace di più perché posso usare overflow nascosto quando ho un piccolo browser – user123

+0

sono felice di aiutarti. –

0

Utilizzare la proprietà overflow-x per nascondere la barra di scorrimento orizzontale su div che crea lo scorrimento orizzontale.

per esempio,

Overflow-x:hidden;

EDIT

Se si desidera 1000px dove il rotolo non deve venire e si tratta ancora nel 1020, il caso è che si dispone di un'imbottitura/margine applicato da qualche parte che sta prendendo quei pixel in più. Devi rimuoverlo per far funzionare le tue cose.

+0

quindi le altre immagini non sono più visibili, queste immagini devono essere visibili ma non dare alcuna barra di scorrimento – user123

+0

Se si desidera 1000px in cui lo scroll non dovrebbe venire e viene ancora in 1020, il caso è che si dispone di una padding/margine applicato da qualche parte che sta prendendo quei pixel in più. Devi rimuoverlo per far funzionare le tue cose.- @marcoverflow – Nitesh

+0

l'ho riparato, grazie per il tuo tempo Nathan – user123

1

L'unica cosa che puoi fare (che mantiene ancora accessibile il tuo sito), è impostare la larghezza su cui dovrebbe apparire la barra di scorrimento.

È possibile risolvere il problema impostando una larghezza minima per il corpo.

Aggiungi questo al vostro foglio di stile:

body { min-width: 1200px; } 

Quando il browser viene ridimensionato più piccolo di 1200px, apparirà la barra di scorrimento.

0

Ho deciso quando il mio browser è inferiore a 1200px, l'overflow: nascosto; può essere utilizzato su una giostra che è larga 1000px. Vladislav Stanic mi ha indicato la direzione giusta, grazie a tutti.

@media all and (max-width: 1200px) { 
    .carousel { 
     overflow-x: hidden; 
    } 
}