Html CSS转换动画不显示

好的。感谢阅读和回复

我试图在悬停时改变div的高度，以显示更多被溢出截断的内容：hidden（尝试文本溢出省略号，但失败得很惨。尽管任务不同！）我的悬停属性工作正常，但是我想包括一个过渡动画，因为仅仅打开div会让人分心。唉，没有这样的运气

但我不太明白我在哪里失败了

.technique_container{
width: 595px;
height: auto;
}

.techpic {
padding: 15px 0px 5px 10px;
width: 15%;
float: left;
height: 100px;
}
.techpic img {border-radius: 15%; margin-top: 15px;}

.technique {
width: 80%;
margin-left: 110px;
height: 118px;
overflow: hidden;
transition: height 1.0s; /* Animation time */
    -webkit-transition: height 1.0s; /* For Safari */
}

.technique:hover {height: auto;}

似乎是一个基本的CSS属性，但缺少什么

这也是一个很好的资源：）

---

谢谢

您不能转换到

高度：自动。我在转换
max height
时取得了一些成功（将
height:auto
替换为
max height:900px；
或某些肯定大于预期高度的数字）。
正如@BR89所说，您无法将元素转换为
auto
的
height
，但您可以将其转换为最大高度。


注意：
someLargeNumber
必须超过
技术的最大可能高度（即
9999px
）

（）
这个例子正确吗？我没有看到一个元素有class
技术
。这个链接指向的是一个资源，而不是有问题的代码@joshcrozierth该链接只是指向我用作参考的一个资源：）不包含我的任何内容或上述内容content@BR89嗯，您的问题是无法将元素转换为
auto
高度。看看这个问题：@JoshCrozier Gah，这太不幸了。谢谢你的提醒。遗憾的是，根据内容的数量，所有的高度都是可变的。有些有3行，有些有20行。如果没有JQuery，可能就没有解决方案。谢谢你的意见！如果只是一个部门，那将是一个伟大的工作。不幸的是，我有大约15个这样的人，他们的内容水平各不相同。为所有这些设置一个最大高度将是一个眼睛痛扩展div只有5行文字我觉得你。jQuery可能是你最好的选择。老实说，在这种情况下是很方便的。（也需要他们的转换插件。）
.technique {
    width: 80%;
    margin-left: 110px;
    max-height: defaultHeight;
    overflow: hidden;
    transition: max-height 1.0s; /* Animation time */
    -webkit-transition: max-height 1.0s; /* For Safari */
}

.technique:hover {max-height: someLargeNumber;}