在縮放後移除空格

Question

在下面的代碼中，divright和divright2之間的空格太多。我該如何解決這個問題？

<div id="leftdiv"></div> 
<div id="rightdiv"></div> 
<div id="rightdiv2">This should start quick under rightdiv</div> 
<div style="clear:both;"></div> 

CSS

#leftdiv{ 
    height:300px; 
    width:100px; 
    background-color:blue; 
    float:left; 
} 
#rightdiv{ 
    height:300px; 
    width:100px; 
    background-color:red; 
    float:right; 
    -webkit-transform: scale(0.7); 
    -moz-transform: scale(0.7); 
    -ms-transform: scale(0.7); 
    transform: scale(0.7); 
    -webkit-transform-origin: top center; 
    -moz-transform-origin: top center; 
    transform-origin: top center; 
} 
#rightdiv2{ 
    clear:right; 
    float:right; 
} 
} 

輸出可以在http://jsfiddle.net/4Msr6/

Answer 1

可以看出我知道它的後期。但我答覆，使這將有助於誰是有同樣的問題

#leftdiv{ 
    height:300px; 
    width:100px; 
    background-color:blue; 
    float:left; 
} 
#rightdiv{ 
    height:300px; 
    width:100px; 
    background-color:red; 
    float:right; 
    -webkit-transform: scale(0.7); 
    -moz-transform: scale(0.7); 
    -ms-transform: scale(0.7); 
    transform: scale(0.7); 
    -webkit-transform-origin: top center; 
    -moz-transform-origin: top center; 
    transform-origin: top center; 
    **margin-bottom: -90px;** 
} 
#rightdiv2{ 
    clear:right; 
    float:right; 
} 
} 

http://jsfiddle.net/4Msr6/10/