2011-03-04 3 views
1

아래에 표시 얻는 방법 : 나는 이제 다음과 같은 HTML을 가정 해 봅시다 텍스트가 <IMG> 태그

<html> 
<div style="text-align: center;"> 
    <img src="http://www.ps.uci.edu/~tomba/ants/sugar.jpg" width="50" height="37" /> 
    This is some centered text blah blah blah and blah 
</div> 
</html> 

지금 당신은 텍스트가 아닌 그것의 오른쪽에있는 이미지 아래에 표시 할. CSS 파일 만 변경할 수없는 이상한 이유가 있다고 해봅시다. 당신이 할 수있는 한 가지는 "display : block"스타일을 <img> 태그에 추가하는 것입니다. 그렇다고해도 이미지는 더 이상 필요로하는 div에 가운데 정렬되지 않습니다.

HTML을 수정할 수 있다면 이미지 바로 다음에 <br />을 넣을 수 있습니다 (너무 많은 br 태그를 사용하는 경우 velociraptor가 먹을 것이라고 말하기는하지만).

아이디어가 있으십니까?

+0

왜 위치를 수정하려면 margin-top을 사용하지 않습니까? – JohnP

+0

HTMl 태그 안에 텍스트를 래핑 할 수 있습니까? 'div' 또는'p' 태그처럼 말하십니까? –

+0

질문이 수정 되었습니까? 내가 대답 할 때 나는 "display : block"에 대한 언급이 없다는 것을 분명히 기억한다 ... 오, 나는 원래의 대답을 삭제했다. :) – FarligOpptreden

답변

6

이미지 표시 블록을 여백으로 설정할 수 있습니다. 0 자동;

img {display:block;margin:0 auto;} 
+0

그건 아주 좋은 답변입니다! – FarligOpptreden

+0

니스! 이것은 벨로시 랩터의 침입에 대한 두려움없이 모든 것을 해결하는 것으로 보입니다. –

+0

실제로 이것이 왜 작동하는지 전혀 알지 못합니다. 이것은 실제로 CSS 사양 뿐이며 임의의 브라우저 동작이 아닙니다. –

관련 문제