如何增加的寬度：使用純CSS

Question

汽車DIV的寬度x個象素我有一個DIV（即設置爲浮動：左），有它寬度設置爲自動因爲我希望它與其內容一樣寬。

在懸停，我想通過增加DIV的寬度說，20個像素。

當設置在固定寬度：懸停 CSS類，容器將得到寬度上懸停，但

1. CSS3躍遷將不適用/能力測試（測試火狐15.0.1）
2. 如果我DIV的含量比固定寬度越大，最終寬度將是不正確的。

如何 - 沒有的JavaScript的使用 - 我能保持DIV的內容調整其內容，並經一定量的懸停像素的增加寬度是多少？

See my JSFiddle here.

Answer 1

我看到了你的小提琴，雖然我不知道這是你所需要的確切療效，試試這個：

.myDiv:hover { 
    padding-right: 20px; 
} 

Answer 2

設置默認填充爲0，懸停填充爲10px在這裏顯示的每一邊。

工作演示：http://jsfiddle.net/jfriend00/YWvTu/

.myDiv { 
    float: left; 
    width: auto; 
    padding: 0; 
    background-color: #eeeeee; 
    border: 1px solid #aaaaaa; 
    -moz-transition: all 0.25s ease-out; 
    -webkit-transition: all 0.25s ease-out; 
    -i-transition: all 0.25s ease-out; 
    transition: all 0.25s ease-out; 
} 
.myDiv.alternative { 
    width: 100px; 
} 
.myDiv:hover { 
    padding: 0 10px; 
}