CSS3 열 개수

Question

div에는 100 %의 너비가 있으며이 안에는 약 10 개의 이미지가 있습니다. 모두 모두 너비와 크기가 다릅니다. 나는이 이미지들을 매끄럽게 움직일 수 있기를 원한다. 나는 이것을 관리했지만 스크린을 가로 지르지 않고 모두 같은 열 너비로 크기가 조정된다. 어쨌든 나는 이것을 바꿀 수있다. 그들은 각각의 크기를 유지하지만 서로를 채우고 있습니까?

나는이있다 : 사전에

.images { 
    line-height:0; 
    -webkit-column-count:6; 
    -webkit-column-gap:0px; 
    -moz-column-count:6; 
    -moz-column-gap:0px; 
    column-count:6; 
    column-gap:0px; 
    background:#545454; 
    width:100%; 
    display:inline-block; 
} 

.images img { 
    width:100% !important; 
    height:auto !important; 
} 

감사합니다!

Answer 1

column 속성은 열의 텍스트를 설정하여 텍스트 흐름이 열의 끝에서 다음 열의 시작까지 계속되도록합니다. 이미지 용으로 사용하는 것은 좋지 않습니다.

묵시적인 목표에 따라 "서로 이미지를 매끄럽게 뜨기"및 "화면을 가로 질러 늘리십시오"와 "그들이 각각의 크기를 유지하지만 서로를 채우는 것"에 따라, 당신은 img 요소를 하나씩 또 하나의 또는을 사용하여 float: left또는 HTML 테이블에 넣거나 CSS table 속성으로 시뮬레이션하는 것만 큼 간단합니다.