Priorité d'affichage sur un swap div
Résolu
Utilisateur anonyme
-
lugdanum Messages postés 116 Date d'inscription Statut Membre Dernière intervention -
lugdanum Messages postés 116 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
j'ai utilisé un code provenant de codepen : https://codepen.io/jcoulterdesign/pen/zdwajv
il fonctionne très bien a un détail prés ...
j'ai ajouter des boutons sur certaine div a la place du lorem ipsum, mais malheureusement les div ce superpose de manière invisible, ce qui m’empêche de pouvoir interagir avec mes boutons car elle sont au dessus des boutons ...
avez vous un moyen de contrer ce soucis ?
j'ai pensé a Z-index mais cela ne semble pas bien fonctionner ...
merci beaucoup de votre future aide.
a très vite
j'ai utilisé un code provenant de codepen : https://codepen.io/jcoulterdesign/pen/zdwajv
il fonctionne très bien a un détail prés ...
j'ai ajouter des boutons sur certaine div a la place du lorem ipsum, mais malheureusement les div ce superpose de manière invisible, ce qui m’empêche de pouvoir interagir avec mes boutons car elle sont au dessus des boutons ...
avez vous un moyen de contrer ce soucis ?
j'ai pensé a Z-index mais cela ne semble pas bien fonctionner ...
merci beaucoup de votre future aide.
a très vite
Configuration: Windows / Chrome 70.0.3538.110
A voir également:
- Priorité d'affichage sur un swap div
- Swap windows - Guide
- Double affichage sur un seul écran - Guide
- Windows 11 affichage classique - Guide
- Problème affichage fenêtre windows 10 - Guide
- Div c++ - Télécharger - Langages
1 réponse
Hello
Par exemple au niveau du css tu ajoutes :
Dans ton html :
Et tu augmente un peu le top dans le css (en fonction de la taille nécessaire // hauteur div) :
->
EX : https://codepen.io/lugdanum/pen/rQoXyx
Tiens nous au courant....
Par exemple au niveau du css tu ajoutes :
.button {
display: inline-block;
padding: 15px 25px;
font-size: 24px;
cursor: pointer;
text-align: center;
text-decoration: none;
outline: none;
color: #fff;
background-color: #4CAF50;
border: none;
border-radius: 15px;
box-shadow: 0 9px #999;
}
.button:hover {background-color: #3e8e41}
.button:active {
background-color: #3e8e41;
box-shadow: 0 5px #666;
transform: translateY(4px);
}
Dans ton html :
<div class='tab tab-1'>
<h1>Prepare gift</h1>
<p><button class="button">Shadow on Hover</button></p>
</div>
Et tu augmente un peu le top dans le css (en fonction de la taille nécessaire // hauteur div) :
body .progress_inner__tabs .tab {
opacity: 0;
position: absolute;
top: 40px;
text-align: center;
margin-top: 80px;
box-shadow: 0px 2px 1px #80b7d5;
padding: 30px;
background: white;
border-radius: 10px;
transition: all .2s;
}
->
top: 150px;
EX : https://codepen.io/lugdanum/pen/rQoXyx
Tiens nous au courant....
merci de ton intervention !!
@ une prochaine