如何增加宽度:auto DIV的宽度乘以X像素使用纯CSS [英] How to increase an width:auto DIV's width by X pixels using pure CSS
问题描述
我有一个 DIV (设置为 float:left ),其宽度
在 上,我想增加 width当在中设置固定的宽度 :hover CSS类,容器将在悬停时获取 width ,但
- CSS3-
- 如果我的 DIV 的内容大于固定的 width em>,最后的宽度将不正确。
我保持 DIV 的内容已调整到其内容,并将它的宽度增加一定量的像素悬停?
< a href =http://jsfiddle.net/jKU9F/ =nofollow>在这里查看我的JSFiddle。
我看到你的小提琴,虽然我不知道这是你需要的确切效果,请尝试:
.myDiv:hover {
padding-right:20px;
}
I have a DIV (that is set to float:left) that has its width set to auto because i want it to be just as wide as its contents.
On hover, i would like to increase width of the DIV by say, 20 pixels.
When setting a fixed width in the :hover CSS class, the container will get that width on hover, but
- CSS3-Transitions won't apply/work (tested in Firefox 15.0.1)
- If my DIV's contents are larger than that fixed width, the final width will not be correct.
How - without the usage of javascript - can i keep the content of the DIV adjusted to its content, and have it increase that width by a certain amount of pixels on hover?
I saw your fiddle, though I'm not sure this is the exact effect you need, try this:
.myDiv:hover {
padding-right: 20px;
}
这篇关于如何增加宽度:auto DIV的宽度乘以X像素使用纯CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!