2014-02-16 6 views
0

아래 코드에서 divrightdivright2 사이에 너무 많은 공백이 있습니다. 이 문제를 어떻게 해결할 수 있습니까?스케일링 후 공간 제거

<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/

+1

당신은 요소를 확장하는 데있다 사람에게 도움이 될 수 있도록 내가 회신하고, 그러나 당신이 밀어해야하므로 폭과 높이가 동일하게 유지' # rightdiv2'에 음수 여백이 있어야합니다. – drip

+0

마진 및 패딩 사용 방법은 어떻습니까? –

+0

@drip - 작동 할지도 모릅니다. 감사합니다 – lock

답변

0

에서 볼 수 있습니다. 그러나이 같은 문제

#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/