2014-04-30 2 views
1

2 개의 DIV가 서로 나란히 수평 정렬되고 래퍼를 사용하여 중심에 배치됩니다. margin-right를 사용하여 DIV1과 DIV2를 구분합니다. DIV2에는 내용이 없습니다. DIV2에 내용이없는 경우에는 여백을 무시하고 DIV1 만 단독으로 배치해야합니다. 당신이 연주 할 때 나는 바이올린을 만들 div가 비어있는 경우 여백을 무시하십시오.

<div style="text-align:center;"> 
    <div id="div1">Div1</div> 
    <div id="div2"></div> 
</div> 

: http://jsfiddle.net/wfrcG/3/

달성하기 위해 CSS의 방법이 있나요

#div1 { 
    display: inline-block; 
    width: 100px; 
    border: 1px solid #000000; 
    margin-left: 200px; 
} 
#div2 { 
    display: inline-block; 
} 

이 HTML입니다 :

내 CSS입니다 이 자바 스크립트없이?

답변

6

요소가 비어있는 경우 0으로 여백을 설정하려면 :empty 의사 클래스를 사용할 수 있습니다.

EXAMPLE HERE

#div2:empty { 
    margin:0; 
} 
+2

처음이의 듣고! 감사 :) –

관련 문제