현재는 height: 100% ; width: auto; 상태입니다.
위에처럼 빨간네모칸 안에 이미지를 넣는데 1.2.번 사진은 양옆에 흰색으로 빈공간이 나오자나요 그걸 꽉채우려
1) width: 100% height: auto; 로 하면 가로는 맞는데 세로가 길이가 이미지 설명 여기 공간까지 침범 하드라고요
2) width: 100% height: 100% 으로하면 사진은 빨간네모칸안에 꽉차는데 비율이 깨져서 이상하드라고요
저걸 제대로 나오게하는 방법은 원본 사진의 비율을 바꾸는 수 밖에 없는건가요? 아니면 css 자체로 해결가능한가요?
빨간네모 하나에 적용되는 css코드를 다 올려보세여..
아래는 빨간 네모칸 부분#main_section > ul > li > a > div.thumbnail{ width: 145px; height: 110px; border: 1px solid red;}아래는 이미지 설명부분#main_section > ul > li > a > div.description{ font-size: 12px; padding: 8px; padding-bottom: 0px; text-align: center;}아래는 이미지 부분#main_section > ul > li > a > div > img{ width: auto; height: 100%; display: block; margin: auto;}
글을 다시 올릴게요 답글로 올리니 이상하네요
원하는게 머에여? 비율을 안깨뜨리면서 빨간 네모칸에 꽉채우려면 빨간 네모칸 크기를 바꿔야하는거 아님?
빨간네모칸안에 사진을 꽉차게 넣고 싶습니다. (비율은 안깨지면서) 빨간네모칸 크기를 안바꾸면 답이 없나요?
object-fit 검색 ㄱㄱ
감사합니다.~~ 123/잠온다님