Foros del Web » Creando para Internet » Diseño web »

combobox para wordpress

Estas en el tema de combobox para wordpress en el foro de Diseño web en Foros del Web. Buenas a todos, A ver si podéis echarme una manita, aunque os aviso que el post va a ser un poco largo porque voy a ...
  #1 (permalink)  
Antiguo 22/09/2015, 07:19
 
Fecha de Ingreso: junio-2011
Mensajes: 151
Antigüedad: 12 años, 10 meses
Puntos: 2
combobox para wordpress

Buenas a todos,

A ver si podéis echarme una manita, aunque os aviso que el post va a ser un poco largo porque voy a meter imágenes y código para que me entendais mejor. El caso es que estoy haciendo una web con wordpress y tengo un problema con un combobox. El combobox lo he realizado desde el propio wordpress para que así, si el cliente quiere añadir o quitar algo lo pueda hacer sin tener que irse a aptana o alguno de estos.
Esto es lo que tengo que hacer:


Total que en wordpress he hecho esto:
Código:
<div class="caja">
<select id="comboHome" name="selCombo" size="1">
<option value="link pagina 0"></option>
<option value="link pagina 1">Mi web está “pasada de moda”</option>
<option value="link pagina 2">Quiero más visitas en mi web</option>
</select>
</div>
Como este combo tiene que tener estilo, pues el css que he realizado es este:
Código:
.caja{
	text-align: center;
	margin:20px auto 40px auto;	
  	border:1px solid #FFFFFF;
   	height:40px;
   	overflow: hidden;
   	position:relative;
   	width: 470px;
}

select#comboHome {
    border: 1px solid #FFF;
    color:#FFFFFF;
    font-size: 16px;
    background-color: rgba(30,30,30,.5);
    padding: 10px;
    width: 470px;
}

select:focus{ outline: none;}

.caja::after{
	border:1px solid #FFFFFF;
	content:"\022c1";
	color:#FFFFFF;
	display:table-cell;
	padding-top:7px;
	text-align:center;
	width:40px;
	height:40px;
	background-color:transparent;
	position:absolute;
	top:0;
	right:0px;	
	pointer-events: none;
}
El problema viene tanto en chrome como en firefox (En IE también, pero no he sacado pantallazo de eso)
Chrome:

Firefox:


Como veis en firefox se ve el cuadrado del combo, pero es que en chrome si os fijais bien, la flechita también aparece.

Mi pregunta es si sabéis cómo prodría quitar eso para que quedase bien.

Un saludo
  #2 (permalink)  
Antiguo 23/09/2015, 02:27
 
Fecha de Ingreso: junio-2011
Mensajes: 151
Antigüedad: 12 años, 10 meses
Puntos: 2
Respuesta: combobox para wordpress

Veo que el post se ha visto muchas veces pero respuestas 0. Finalmente he conseguido encontrar la respuesta:
en el css he añadido esto:
Código:
#selectHome {
    border: 1px solid #FFF;
    color:#FFFFFF;
    font-size: 16px;
    background-color: rgba(30,30,30,.5);
    padding: 8px;
    width: 470px;
    height:40px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
Lo que está en negrita es lo que he añadido y es lo que quita en chroome y mozilla los fallos. En IE sigue apareciendo.

Un saludo.

Etiquetas: combobox, css, todo, wordpress
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 11:45.