Nueva pregunta

Pregunta:

Fecha: 08-03-2021 12:24:54 (En Español)

Problemas con el diseño de un input en los navegadores[No resuelta]

He desarrollado un input type search para realizar búsqueda de personas para una red social. Resulta que estoy trabajando un un Framework de diseño pero el input type search para buscar personas lo personalice un poquito con mis propios estilos css porque no me gusta los estilos que me facilita el framework.

Resulta que en el navegador Google Chrome se ve muy bien el input pero en firefox este no se ve muy bien. He probado en casi todos los navegadores y solo se ve mal en Firefox y no se como solucionar este problema.

Firefox:
[url=https://ibb.co/qDvQJ0M][/url]

Google Chrome:
[url=https://ibb.co/8jFTw56][/url]

Solo quiero que en Firefox se vea igual que en el navegador Google Chrome.

Código CSS3 personalizado del input type search:

/* label input type search */
.input-field input[type=search]:focus + label {
  color: #9c27b0 !important;
}

/* label underline focus color type search */
.row .input-field input[type=search]:focus {
  border-bottom: 1px solid #9c27b0 !important;
  box-shadow: 0 1px 0 0 #9c27b0 !important;
}

/* label focus color */
.input-field input:focus + label {
  color: #fa4299 !important;
}

/* label underline focus color */
.row .input-field input:focus {
  border-bottom: 1px solid #fa4299 !important;
  box-shadow: 0 1px 0 0 #fa4299 !important;
}
Etiquetas: CSS - CSS3 - Firefox - Google Chrome Votos: 0 - Respuestas: 1 - Vistas: 5 Compartir en: Google Facebook Twitter LinkedIn Link
 

Respuestas:

  • Fecha: 07-04-2021 06:58:39 Has probado agregando a tu CSS -webkit-box-shadow y -moz-box-shadow?. Por ejemplo:
    .elemento {
    -webkit-box-shadow: 0 8px 6px -6px black;  
    -moz-box-shadow: 0 8px 6px -6px black;        
    box-shadow: 0 8px 6px -6px black;
    }
      Votos: 0 - Link respuesta
     
Para participar activamente de la comunidad primero debes autenticarte, ingresa al sistema.Iniciar Sesión
 
frjcbbae garagebible.com