반복적 인 배경 이미지 미디어 쿼리를 사용하는 100 % Div

Question

나는이 문제를 해결하는 데 어려움을 겪고 있습니다.

화면에 100 % 반복되는 배경 이미지가있는 div가 있습니다.

.services_wrap { 
    width:100%; 
    height:200px; 
    background:url('../images/services_tile.png') repeat-x; 
} 

<div class="services_wrap"> 
    //Content 
</div> 

을 나는 화면 크기를 조정할 때 보통의 div처럼, 그 전체 사업부를 축소하는 미디어 쿼리를 지정합니까 어떻게은 다음과 같습니다 :

@media screen and (max-width: 650px) { 

    /*Makes the logo shrink*/ 
    #header { 
      height:auto; 
    } 
} 

하지만 경우를 이렇게 말할 수 .services_wrap로 시도해보십시오. 아무 일도 일어나지 않습니다.

저는 행운과 함께 background-size : properties를 시도했습니다.

반복되는 이미지의 크기를 조절할 수 있습니까?

Answer 1

사용 background-size

div { 
    background: url("//www.placehold.it/50x50") repeat-x; 
} 

@media screen and (max-width: 900px) { 
    div { 
     background-size: 25px; 
    } 
} 

이 해결

Demo