Foros del Web » Creando para Internet » CSS »

Problemas para visualizar check box en navegadores

Estas en el tema de Problemas para visualizar check box en navegadores en el foro de CSS en Foros del Web. Hola amigos, tengo un problema, estoy trabajando con un diseño de página, todo resulta bien, pero cuando empiezo a probar en distintos navegadores los checkbox ...
  #1 (permalink)  
Antiguo 06/05/2014, 10:53
 
Fecha de Ingreso: septiembre-2008
Mensajes: 72
Antigüedad: 16 años, 2 meses
Puntos: 0
Exclamación Problemas para visualizar check box en navegadores

Hola amigos, tengo un problema, estoy trabajando con un diseño de página, todo resulta bien, pero cuando empiezo a probar en distintos navegadores los checkbox no se visualizan, esto ocurre en Safari y chrome, en cambio en Firefox y Explorer si se ven.

Estoy trabajando con un reset.css para limpiar todos los estilos, en realidad necesito trabajar con ese css y que los checkbox se puedan visualizar.

Envió código que uso para ver si me pueden ayudar a solucionar este problema.

RESET.css

Código CSS:
Ver original
  1. html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, select, input {
  2.     margin: 0;
  3.     padding: 0;
  4.     border: 0;
  5.     outline: none;
  6.     vertical-align: baseline;
  7.     font-weight: normal;
  8.   font-style: normal;
  9.   -webkit-appearance: none;
  10.   appearance: none;
  11. }
  12.  
  13. /* HTML5 display-role reset for older browsers */
  14. article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
  15.  
  16. body { line-height: 1; }
  17.  
  18. ol, ul { list-style: none; }
  19.  
  20. blockquote, q { quotes: none; }
  21.  
  22. blockquote:before, blockquote:after, q:before, q:after {
  23.     content: '';
  24.     content: none;
  25. }
  26.  
  27. .clear {
  28.   clear: both;
  29. }

estilos.css
Código CSS:
Ver original
  1. input[type=radio]:checked {
  2.     background-position: 0px -12px;
  3. }
  4.  
  5. input[type="checkbox"]{
  6.         background-color: red;
  7.         border: 2px solid blue;
  8.         color: yellow;
  9.         height:30px;
  10.         width:30px;
  11.     }
  12.  
  13.  
  14. .check {
  15.     height: 20px;
  16.     width: 20px;
  17.     background: url(../images/form_checkbox.png) no-repeat;
  18.     cursor: pointer;
  19.     float: left;
  20.    
  21. }
  22.  
  23. .check:checked {
  24.     background-position: 0px -20px;
  25. }

Código HTML:
Ver original
  1. <input type="checkbox" name="" id="adv2" class="check"/><label for="adv2" class="check_txt">XXXXX</label>

Gracias amigos y ojalá esto tenga solución.
  #2 (permalink)  
Antiguo 06/05/2014, 11:00
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Problemas para visualizar check box en navegadores

Tendrá que ver esta linea supongo:

Código CSS:
Ver original
  1. -webkit-appearance: none;

  #3 (permalink)  
Antiguo 06/05/2014, 11:17
 
Fecha de Ingreso: septiembre-2008
Mensajes: 72
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Problemas para visualizar check box en navegadores

Amigo, toda la razón, muchas gracias por la ayuda

Etiquetas: background, box, color, html, navegadores, página
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 21:49.