max-width로 반응형 이미지를 만들고 싶은데..

max-width로 반응형 이미지를 만들고 싶은데..

QA

max-width로 반응형 이미지를 만들고 싶은데..

본문

 

크롬은 창 크기를 줄이면 잘 줄어드는데 익스플로러나 파이어폭스는 꼼짝을 안하네요..

강좌를 봐도 이해가 잘 안되서 ㅠㅠ....

 


img {
  /* width:inherit; */
  max-width:100%;
  height:auto;
}
 
iframe, embed, video {
  /* width:inherit; */
  max-width:100%;
} 

 

크롬

 

8895ea43cdae5542b57633cb5498702a_1422333355_2982.png

 

익스플로러


8895ea43cdae5542b57633cb5498702a_1422333355_3773.png
8895ea43cdae5542b57633cb5498702a_1422333355_536.png
 

이 질문에 댓글 쓰기 :

답변 3

이미지의 css

img {
  width: inherit;
  max-width: 100%;
  height: auto;
}

 

이미지를 감싼 요소의 css

.lmgLay{

 width:300px;

 border:2px solid #e5e5e5; 

}

 

이미지

<div class="imgLay"> 

 <img src="/img/hahaha.jpg" style="width:500px;height:400px;" />

</div> 

불량님이 했는데로 임의로 html 만들어서 하니까 잘되는군요.

게시판 스킨이 문제인것 같습니다. ㅠㅠ....;;

 


<!doctype html>
<html lang="ko">
 <head>
  <meta charset="UTF-8">
  <title>Test</title>
  <style>
img {
  max-width: 100%;
  height: auto;
}
 
  </style>
 </head>
 <body>
  
 
<img src="http://i.imgur.com/e2xtbq5.jpg"  />
 
 
 </body>
</html> 

아래 코드를 제거하니 잘되는군요. +_+

 


<!-- 에러 발생 원인 -_-! -->
<table border=0 cellpadding=0 cellspacing=0 width=100%><!-- <?=$width?> -->
<tr>
    <td height=30 background="<?=$board_skin_path?>/img/view_dot.gif"">
        <div style="float:left;">
         글쓴이 : 
        <?=$view[name]?><? if ($is_ip_view) { echo " ($ip)"; } ?>
        </div>
        <div style="float:right;">
        조회 : <?=number_format($view[wr_hit])?>
         
        </div>
    </td>
</tr>
<!-- 끝 --> 
답변을 작성하시기 전에 로그인 해주세요.
전체 123,786 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT