2012-08-24 1 views
0

http://jsfiddle.net/sheriffderek/4JkkF/1/ /// 새로운 버전의 피들 ///이미지가 포함되지 않은 둥근 모서리/img/overflow : hidden;

이 jsfiddle을 확인하십시오.

둥근 모서리가있는 해당 div의 테두리 안에 이미지를 유지하는 데 문제가 있습니다. 내가 다 ... 어떤 도움이 많이 주시면 감사하겠습니다에 국경 반경을 넣어 질문을 받았다 때까지 ... 정말 간단했다

enter image description here

상황에 대한 자세한 설명 ... A의

각 게시물에 대한 CSM은 필드를 채 웁니다 ...

하나는 제목으로, 하나는 설명으로, 다른 하나는 설명으로, 그리고 하나는 슬라이더로 들어가는 이미지로 호출됩니다. (img의 목록) <img src="" alt="">'s 등 ...

전체 레이아웃이 액체입니다. 따라서 div와 같은 "프레임"뒤에 이미지가 있어야합니다. CSS의 배경 이미지처럼 ... . 그리고 둥근 모서리를 엉망이없이 크기를 변경 ... 나는 img를 스타일링하면서 할 수있다. 그러나 나는 단지 어떤 이유로 생각했다 - img이 사는 div는 바깥 쪽 가장자리를 지시 할 것이다 ... 그러나 - 지금까지 나는 잘못되었습니다 ...

+0

는 당신이, 둥근 모서리있다 사업부를 만들기 위해 찾고 계십니까 배경 이미지? – tahdhaze09

+0

섬네일이 php로 채워지기 때문에 인라인 이미지를 사용해야합니다 ... background : url(); 위대한 작품 ... 그리고 그 이유는 내가이 문제에 빠졌어요 ... 그것은 항상 내가 뭘 항상. – sheriffderek

+0

아마 PHP 태그를 질문에 추가해야합니다. 배경 이미지가 CSS가 아닌 PHP에 의해 그려지기 때문에 퍼즐의 중요한 부분입니다. – tahdhaze09

답변

0

border-radius을 지정하면 내용이 테두리 안에 "감겨"져서 div의 이미지가 잘리지 않고 구석으로 밀려납니다. 이미지를 background (div) 대신 사용하여 원하는 동작을 얻을 수 있습니다.

약간의 작업 데모 : little link.

어떤 방식 으로든 도움이 되었기를 바랍니다.

+0

감사합니다. -하지만 인라인 이미지를 사용해야합니다 ... 넣을 수 없습니다. PHP에서 PHP 데이터 ... 다른 아이디어? – sheriffderek

+0

@sheriffderek * *로 PHP 데이터를 CSS *에 넣을 수 없다는 것은 무엇을 의미합니까? – Chris

+0

확인. 내가 CMS를 가지고 필드는 이미지가 ... 그리고 경우 - - 그래서 CSS의 배경 속성에 해당 이미지를 넣어 싶어 ... – sheriffderek

0

하지만 IMG가 처음에 사업부를오고 내가 왜 이해가 안 돼요 ...

1 경우 이미지 자체는 주변 사업부보다 크다. 하지만 주변 div의 오버 플로우 : 숨겨진 플러스 폭 & 높이가 있습니다.

그래서 서라운드 div.thumbnail 늘 확장 ..

나의 제안은 다음과 같습니다

<div class="thumbnail" style="height:50%;width:50%;position:static"> 
    <img src="http://derekthomaswood.com/place/blink3.gif" alt="" style="position:static; display: block;width:100%;height:100%"> 
</div> 
<!-- of course adjusting the classes, not as inline css ;-) 
    resizing works over adjusting the div.thumbnails dimensions 
--> 

HTH Gekkstah

관련 문제