Hola.
Tengo un menu acordeon realizado con JqueryUI y me funciona perfecto.
El encabezado de cada apartado del acordeón es un h4, cuando los despliego haciendo click del ratón en cada h4 me gustaría que se quedase la pantalla en dicho h4 porque el contenido posterior es muy extenso.
¿Hay alguna forma de hacerlo con CSS3?
El código que tengo es:
Código:
h4.acordeon {
font-size: 1.5em;
background: rgb(158, 156, 156);
width: 90%;
margin-bottom: 3px;
-webkit-border-radius: 0.625em;
-moz-border-radius: 0.625em;
-ms-border-radius: 0.625em;
border-radius: 0.625em;
padding: 0.3125em;
text-decoration: none;
cursor: pointer;
}
h4.acordeon:after{ content: '\25BE'; margin-left: 10px; cursor: pointer;}
h4.acordeon a {
text-decoration: none;
color: black;
}
h4.acordeon a:hover {
color: white;
}
.contacordeon {
border: 0.0625em solid #666;
margin-bottom: 3px;
height: auto;
}
.contacordeon .block {
padding: 1.25em;
}
.contenido-texto p{
text-align: justify;
line-height: 40px;
}
Por cierto, en la línea que pone:
He notado que en Dolphin (navegador móvil) no lo veo bien, sale un símbolo raro, ¿hay alguna forma de que se pueda ver correctamente en todos los navegadores?
Gracias