Wordpress 테마의 사이드 바는 CSS로 특정 윈도우 크기에서 어떻게 쌓을 수 있습니까? 테마 전체 크기 때

Question

이입니다

브라우저의 창은 작아 사이드 바 하단으로 이동하고 메인 컨텐츠 전체 레이아웃을 차지하는 경우 :

을

나는 이것이 트릭을 수행하는 CSS라고 생각합니다.

} 
#primary { 
    float: left; 
    margin: 0 -26.4% 0 0; 
    width: 100%; 
} 
#content { 
    border-top: 1px solid #444; 
    margin: 0 34% 0 7.6%; 
    padding: 20px 0 1.625em; 
    width: 58.4%; 
} 
#secondary { 
    float: right; 
    margin-right: 7.6%; 
    width: 18.8%; 
} 

(확실하지 않음).

이것은 주제가 demo입니다.

CSS를 사용하여 특정 창 크기에서 사이드 바를 어떻게 쌓아 올릴 수 있습니까 (주 콘텐츠가 모든 공간을 차지하게합니까)?

Answer 1

이것은 반응 형 디자인이라고합니다. 이것을 확인하십시오 : coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/.

위 wordpress 테마에는 https://s2.wp.com/wp-content/themes/pub/twentyeleven/style.css에서 연결되는 파일 style.css가 있습니다. 이 파일에는 특정 창 크기에서 사이드 바를 쌓아 올리는 코드가 있습니다.

@media (max-width:800px) { 
    [...] 
    #main #secondary { 
    float:none; 
    margin:0 7.6%; 
    width:auto; 
    } 
    [...] 
} 

@media (최대-폭 : 800 픽셀) 사이드 지정된 화면 크기 이하로 자동 조정 만드는 일이다. 네가 가지고 있기를 바란다.