Skip to content

Safari y Chrome. Resaltado de input y textarea. CSS

12 diciembre 2011

Por defecto, tanto Safari como Chrome tienen reglas CSS asignadas a los input (cajas de texto) y textarea, que provocan que cada vez que una de ellas recibe el foco de la aplicación se le asigne un borde llamativo para indicarlo.

Este borde puede resultar muy útil en determinadas ocasiones, pero en otras puede desentonar completamente con el diseño de la aplicación web que estemos desarrollando. En este segundo caso puede deshabilitarse añadiendo una regla CSS muy simple (o en lugar de deshabilitarlo podemos adaptarlo a nuestras necesidades si nos interesa):

.sin_resaltado{

outline: none;

}

De esta forma si asignamos esta clase a algun input o textarea, dejarán de mostrar ese resaltado que añaden por defecto Safari y Chrome.

Cualquier mejora, sugerencia, …. será siempre bienvenida 😉

Más Info: Outline Property

Anuncios
3 comentarios leave one →
  1. 13 diciembre 2011 00:41

    Justo tuve que usar esta regal CSS el otro día en un proyecto de clase. Espero que el profesor que lo va a ver se fije…. Saludos.

  2. salomon permalink
    27 junio 2012 07:39

    que barbaro, casi cuelgo los guantes de tanto buscar una solucion a esto, ¡¡¡me salvaste viejo !!! xd

  3. jaime permalink
    21 enero 2016 16:31

    viejo muchas gracias tantas posibles soluciones y esta es la única que me sivio

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: