Spazio vuoto bootstrap Twitter sul lato destro della pagina

Question

Ho riscontrato un problema con il foglio di stile reattivo con Twitter Bootstrap. Il sito si presenta bene senza problemi, ma per qualsiasi motivo il tablet e il telefono reattivo hanno questo enorme spazio bianco a destra della pagina. La sua non è la barra di scorrimento problema suo un enorme divario bianco

http://i.imgur.com/JeRRRqq.png

io non credo che abbia cambiato molto a tutti qui. Niente con larghezza o altro. Ispezionato gli oggetti in Chrome e poteva vedere tutto ciò che trabocca oltre la larghezza saggio

Answer 1

Potrebbe essere un po 'tardi ma ho trovato che le altre risposte sono fuorvianti.

È vero che la classe di riga è ciò che sta causando il problema, ma è perché è sempre previsto che venga inserito all'interno di un elemento contenitore.

da http://getbootstrap.com/css/:

Righe devono essere posizionati all'interno di un .container (larghezza fissa) o .container fluido (larghezza intera) per il corretto allineamento e imbottitura.

L'elemento contenitore di solito ha una spaziatura di -15px sia a destra che a sinistra e la classe di riga ha una spaziatura 15px a destra e sinistra. I due si annullano a vicenda. Se uno dei due non è presente, vedrai spazio extra.

Answer 2

Aggiungere il seguente meta tag HTML

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=320, height=device-height, target-densitydpi=medium-dpi" /> 

provare anche l'impostazione

html, body. div{ 
    margin: 0 !important; 
    padding: 0 !important; 
    width: 100%; 
} 

sul html e corpo

Answer 3

Hai provato:

html, body { overflow-x: hidden; } 

Puoi pubblicare un violino?

Answer 4

Generalmente questo accade perché si dispone di un div che supera i limiti della larghezza del contenitore impostato, può essere un div o sezioni riempimento, margine, posizionamento .. è possibile utilizzare la freccia o l'overflow dell'ispettore: nascosto sul tag contenitore per vedere quale sezione potresti aver infranto la larghezza.

Answer 5

Ho lo stesso problema. Ho scoperto che l'oggetto che stava causando la creazione del padding era la classe "riga" di Bootstrap.

Se si aggiunge

.row { 
    padding-right: 0px; 
    margin-right: 0px; 
} 

al vostro file CSS/fila oggetti questo dovrebbe risolvere almeno uno degli elementi che hanno inciso imbottitura sulla tua pagina.

Answer 6

Inoltre, controlla come stai usando i contenitori. Non possono essere annidati, causeranno problemi.

È possibile scegliere uno dei due contenitori da utilizzare nei progetti. Si noti che, a causa del riempimento e di altro, nessuno dei due contenitori può essere nidificato.

Source: http://getbootstrap.com/css/#overview-container

Answer 7

Ho appena avuto un problema molto simile, e dopo aver trascorso un po 'di tempo, ho capito che avevo applicato stili CSS aggiungendo imbottitura 0px sia a sinistra ea destra di una classe contenitore del liquido, e quindi lo stile ha sovrascritto il riempimento predefinito di -15px necessario sul fluido del contenitore per contenere le righe nella posizione corretta.