CSS div error de background de color en cromo?

Tengo problemas para configurar el background de un div en el browser Chrome. Si ves, tengo una pequeña caja gris más liviana que no implementé y no di estilo. Aparece random y se mueve y cambia de forma como lo desee. No ocurre en Safari o en Firefox y no puedo entender por qué ni cómo solucionarlo.

Pantalla de impresión de errores de Chrome

Mi problema es bastante extraño. Tengo el siguiente código:

div className="row competition"> <div className="col-lg-6 register-answer"> <div className="compet-content"> <input type="text" className="form-control answer" id="usr"/> <input type="text" className="form-control email" id="usr"/> <button type="button" className="btn btn-primary">Enter Competition</button> </div> </div> <div className="col-lg-6"> <div className="pic"> <img src={CompetitionImage} alt="Competition Image"/> </div> </div> </div> 

Editado (classs de CSS):

 .col-lg-6.register-answer { background-color: #adadad; .compet-content { width: 100%; height: 100%; input { } button { } } } 

Estoy configurando el backgound-color en la class 'register-answer', pero probé en cada div y el problema siempre es el mismo (solo ocurre en Chrome). También tengo una grabación de pantalla para que veas: https://drive.google.com/file/d/0B9yzCbrCAKvKRVE3VmNJNmhqLVk/view?usp=sharing

También estoy teniendo este problema y encontré esto: http://www.parallaxinfotech.com/blog/addressing-css-artifacts-left-screen-chrome

-webkit-transform: translate3d(0,0,0); la solución … -webkit-transform: translate3d(0,0,0); en la regla donde especifico background-color ( body , en mi caso) y eso funcionó. Todavía estoy buscando una mejor solución.

ACTUALIZACIÓN: Parece que esto es un error de Chromium . Si quieres resolverlo para todos tus visitantes, el truco anterior parece funcionar. Si desea resolverlo solo para usted, puede ir a chrome://flags/#enable-gpu-rasterization y habilitar rasterización de GPU. Me imagino que este error será resuelto por el equipo de Chrome muy pronto, así que decidí no usar el hack.

intente agregar color de background: transparente en los divs que desea para que el background gris aparezca en

He estado lidiando con el mismo problema.

Me di count de que si agrega un borde al elemento donde se aplica el color de background, la caja de luz desaparece.

Si no interfiere con su layout, le sugiero que agregue un borde que sea del mismo color que su background.

En tu caso:

 .col-lg-6.register-answer { border: 1px solid #adadad; } 

O, si te sientes aventurero testing un background (casi) transparente con background-clip: padding-box. Su transparencia tiene que ser> 0 para que el truco funcione. Configuro el mío o 0.01 y funciona (es decir, rgba (240, 240, 240, 0.01).