CSS : 오버플로 항목을 새 행으로 바꾸기

방금 WP 테마를 구입했습니다 : http://demo.wpzoom.com/evertis/ 및 "주요 기사"섹션을 수정하고 싶습니다.CSS : 오버플로 항목을 새 행으로 바꾸기

모든 추천 기사를 보려면 스크롤 단추를 사용하는 대신 모든 추천 기사 (예 : 한 행에 3 개의 기사)를 모두 표시하고 싶습니다.

CSS를 수정하려고하지만 원하는 것을 얻을 수 없습니다. 대부분의 "오버플로"기사는 텍스트에 관한 것입니다.

 .scrollable { 

    /* required settings */ 

    position:relative; 

    overflow:hidden; 

    width: 930px; 

    height:400px; 

} 
.slide { 

-webkit-border-radius: 5px; 

-khtml-border-radius: 5px; 

-moz-border-radius: 5px; 

border-radius: 5px; 

background:#e6eef4; 

padding:10px; 

margin:0 20px 0 0; 

float:left; 

width:270px; 

position:relative; 

display:inline; 

}

나는 파이어 폭스 파이어 버그를 사용하고 서로 다른 조합을 시도했다 "디스플레이 : 블록"과 "플로트 : 자동"하지만 정확히 원하는 것을 얻을 수 없습니다. 하나의 기사를 한 줄만 표시하도록 할 수 있습니다.

출처

2012-06-11 Susan Mayer

에서 병합 /이 CSS를 추가하면 그것을 할 것입니다 :

#thumbs { 
    width: auto; 
    position: static; 
    overflow: hidden; 
} 
.scrollable { 
    overflow: visible; 
    height: auto; 
}

출처

2012-06-11 23:04:41 thirtydot

이 마법입니다! 코드가 매력처럼 작동합니다! 제가 처음으로 답을 보았을 때, 나는 "높이 : 400px;"와 "float : left"를 변경하지 않았기 때문에 그것이 효과가 있을지에 대해 심각하게 의심합니다. 어떻게 그렇게 될수 있니? 나는 어딘가에서 "float : left"와 "display : inline"을 주로 읽었습니다. ".scrollable"에서 "height : 400px;"를 변경해도 코드가 어떻게 작동합니까? –

'# featured '가 그날을 저장했기 때문에 문제가되지 않았습니다. 그것은'float : left'을 가지고있어서 float을 포함하고 있습니다. 나는 동일하게 보일만한 것에 대한 나의 대답을 편집했으나 더 합리적이다. – thirtydot

수락하고 감사합니다. –

CSS : 오버플로 항목을 새 행으로 바꾸기

답변

관련 문제