Yo tampoco entendí mucho, creo que salio bastante rebuscada la explicación.
aun así viendo tu código rescato esto
Código CSS:
Ver original.sale-box2 {
/*height: 100px;*/
height: 50%;
left: 0px;
overflow: hidden;
position: absolute;
text-align: center;
top: 0px;
/*width: 100px;*/
width: 90%;
z-index: 9;
}
juego de adivinanzas? encuentra tu error :D
vuélvete a plantear tu problema y encuentralo en ese fragmento de codigo.
Creo que mas que la venganza del z-index, es venganza de la falta de conocimiento.... tu problema no radica en que uses height 100% y afecte al boton que mencionas.
es solo que te falta leer la documentacion CSS, aqui te van 2 puntos esenciales que necesitas para que te funcione bien
1.- la posision absoluta toma como referencia el ancestro mas proximo con una posision definida, asi sea por lo menos position:relative
2.- las propiedades height y width al tener porcentajes como valor, requieren que su ancestro tenga un ancho/alto definido, de lo contrario seria el porcentaje de 0 (cero) es decir 100% de 0 = 0 por ende no se vera ni podras seleccionarlo.
nota: los atributos en linea por default no tienen ancho ni altura definidos, debes hacerlos que se comporten como elementos en block