[CSS] display:none 인지 아닌지를 선택자로 사용하는 방법

[ 조건 ]

<p class="error-txt"></p>가 버튼이 보일 때는 margin-top: 10px,

버튼이 없을 때는 margin-bottom: 10px; 이 되어야 한다.

[ 궁금증 ]

스크립트를 쓰지 않고, CSS로만 제어하고 싶다.

display: block/none 상태를 선택자로 사용할 수 있을까?

[ 해결 ]

만약 요소가 style 속성을 사용하고 있다면 CSS3로 해결 할 수 있다.

.user-pw 
    dd > button + .error-txt
	margin: 0 0 10px
    button:not([style*="display: none"]) + .error-txt
	margin: 10px 0 0

[ 참고 ]

http://stackoverflow.com/questions/5275098/a-css-selector-to-get-last-visible-div

See the Pen display:none/block seletor by Hyejin Oh (@mmt-zinee) on CodePen.