CSS height auto

Messages postés
39
Date d'inscription
lundi 10 avril 2017
Dernière intervention
8 mai 2017
- - Dernière réponse : cs_stay
Messages postés
496
Date d'inscription
jeudi 7 juillet 2005
Dernière intervention
24 mai 2017
- 21 mai 2017 à 17:34
Bonjour,
Voici mon code :
#nav_container {
            width: 100%;
            height: 0;
            position: fixed;
            top: 42px;
            right: 0;
            background-color: brown;
            overflow: scroll;
            transition: all .2s;
        }
        #nav_icon:hover {
            background-color: purple;
        }
        #nav_icon:hover #nav_container {
            height: auto;
        }

J'aimerais savoir s'il y a moyen de faire la transition pour la valeur de height quand elle passe à auto. Merci ;)
Afficher la suite 

Votre réponse

3 réponses

Messages postés
23618
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
15 décembre 2018
0
Merci
Bonjour,

A ta question.. la réponse me semble être "oui".

... pour aller plus loin.....
as tu essayé :
-webkit-transition: width 2s; /* Safari */
    transition: width 2s;

https://developer.mozilla.org/fr/docs/Web/CSS/CSS_Transitions/Utiliser_transitions_CSS



.
iamtheone
Messages postés
39
Date d'inscription
lundi 10 avril 2017
Dernière intervention
8 mai 2017
-
Oui j'ai essayé mais le résultat est le même...
Commenter la réponse de jordane45
Messages postés
1663
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
3 novembre 2018
0
Merci
et en modifiant aussi le overflow

#nav_icon:hover #nav_container {
overflow:hidden;
height: auto;
 }


rien ne sert de courir il faut partir a point.
cours Forest cours !
iamtheone
Messages postés
39
Date d'inscription
lundi 10 avril 2017
Dernière intervention
8 mai 2017
-
Ça ne change rien... C'est juste le auto qui pose problème, si je met une baleur fixe pour height ça marche très bien.
Commenter la réponse de @karamel
Messages postés
1663
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
3 novembre 2018
0
Merci
sans en avoir la certitude absolut je dirait que c'est pas possible
cs_stay
Messages postés
496
Date d'inscription
jeudi 7 juillet 2005
Dernière intervention
24 mai 2017
-
Quelle serait l'utilité ? Car si tu as une chaine de caractère dans ton tag#nav_icon. Cela fonctionne !

https://www.w3schools.com/css/tryit.asp?filename=trycss3_transition1
<!DOCTYPE html>
<html>
<head>
<style> 
div {
    width: 100px;
    height: 100px;
    background: red;
    -webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */
    transition: width 2s;
}

div:hover {
    width: 300px;
    height: auto;
}
</style>
</head>
<body>

<p><b>Note:</b> This example does not work in Internet Explorer 9 and earlier versions.</p>

<div>une chaine</div>

<p>Hover over the div element above, to see the transition effect.</p>

</body>
</html>
Commenter la réponse de @karamel

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.