테스트 사이트 - 개발 중인 베타 버전입니다

그누모드 반응형 태그 채택완료

ecoseobu 1개월 전 조회 130

안녕하세요 

반응형으로 만들었는데 pc에서 width가 720, 모바일에서는 꽉찬화면이 나오면 좋겠는데

잘 안됩니다. 도움 부탁드려요

어느 부분을 수정 추가 해야되는지 알려주시면 감사하겠습니다.

 


<div style="width:100%; max-width:720px; width:min(100%,720px); margin:0 auto; line-height:1.7; box-sizing:border-box; word-break:keep-all; overflow-wrap:anywhere;">

  <!-- 1. 상품이미지 -->
  <div style="color:#333; font-family:NanumGothic,'맑은 고딕',sans-serif; text-align:center; margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:15px; box-sizing:border-box; background:#fff;">
    <img src="https://www.eco-seobu.co.kr/data/editor/2509/ef2e39e5a729726fe2afc49a2d7157bd_1758492742_5241.jpg" title="ef2e39e5a729726fe2afc49a2d7157bd_1758492742_5241.jpg" alt="팡이자바 500ml 제품 대표 이미지" style="max-width:100%; height:auto; display:block; margin:0 auto; border:0;">
    <br style="clear:both;">
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  </div>
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>

  <!-- 2. 상품명 -->
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  <div style="color:#333; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:16px; background:#fafafa; box-sizing:border-box;">
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <h2 style="margin:0; font-size:20px; color:#2e7d32;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">상품명</span></h2>
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <p style="margin:6px 0 0; font-size:18px; color:#111;"><strong><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">팡이자바500ml</span></strong></p>
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  </div>
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>

  <!-- 3. 특징 -->
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  <div style="margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:16px; background:#fff; box-sizing:border-box;">
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <h2 style="color:#2e7d32; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:0; font-size:20px;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">제품의 특징</span></h2>
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <p style="margin:6px 0 0;"><span style="color:#444; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif; font-size:18px;"></span><font color="#444444" face="나눔고딕코딩, NanumGothicCoding, sans-serif"><span style="font-size:18px; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">팡이자바는 안정화이산화염소나 차아염소산나트륨이 아니며 세계 최대의 고농도 순수 이산화염소입니다.</span></font></p>
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  </div>
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>

  <!-- 4. 사용방법 -->
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  <div style="margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:16px; background:#fff; box-sizing:border-box;">
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <h2 style="color:#2e7d32; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:0; font-size:20px;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">제품 사용방법</span></h2>
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <p style="margin:6px 0 0;"><span style="color:#444; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif; font-size:18px;"></span><font color="#444444" face="나눔고딕코딩, NanumGothicCoding, sans-serif"><span style="font-size:18px; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">전생육기 - 물 20리터에 팡이자바 20ml 희석하여 20일 간격으로 꾼준히 살포합니다.</span></font></p>
    <p style="margin-top:6px;"><font color="#444444" face="나눔고딕코딩, NanumGothicCoding, sans-serif"><span style="font-size:18px; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">장해발생시 - 물 20리터에 팡이자바 40ml 희석하여 3~5일 간격으로 2회 살포합니다.</span></font></p>
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  </div>
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>

  <!-- 4-1. 사용장소 -->
  <div style="margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:16px; background:#fff; box-sizing:border-box;">
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <h2 style="color:#2e7d32; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:0; font-size:20px;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">사용장소</span></h2>
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <p style="margin:6px 0 12px; font-size:18px; color:#444;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> 다양한 환경에서 활용할 수 있습니다. (예: 비닐하우스, 과수원, 저장고, 주거·상업공간 등) </span></p>
    <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <div style="text-align:center;">
      <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
      <img src="https://www.eco-seobu.co.kr/data/editor/2509/ef2e39e5a729726fe2afc49a2d7157bd_1758493377_9269.jpg" title="ef2e39e5a729726fe2afc49a2d7157bd_1758493377_9269.jpg" alt="팡이자바 사용장소 예시 이미지" style="max-width:100%; height:auto; display:block; margin:0 auto; border:0;">
      <br style="clear:both;">
      <span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    </div>
  </div>
  

  <!-- 5. 주의사항 -->
  <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
  <div style="margin:0 auto 15px; border:1px solid #ddd; border-radius:10px; padding:16px; background:#fffde9; box-sizing:border-box;">
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <h2 style="color:#c47f00; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:0; font-size:20px;"><span style="font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">주의사항</span></h2>
    <span style="color:#333; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;"> </span>
    <ul style="color:#5d4037; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:6px 0 0; padding:0; list-style:none; font-size:18px;"></ul>
    <ul style="margin:6px 0 0; padding:0; list-style:none;">
      <p><font color="#5d4037" face="NanumGothic, 맑은 고딕, sans-serif"><span style="font-size:18px; font-family: 나눔고딕코딩, NanumGothicCoding, sans-serif;">반드시 다른 약제와 혼용하지 마시고 팡이자바 단독으로 살포하십시오.</span></font></p>
    </ul>
    <ul style="color:#5d4037; font-family:NanumGothic,'맑은 고딕',sans-serif; margin:6px 0 0; padding:0; list-style:none; font-size:18px;"></ul>
  </div>

</div>
 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
1개월 전

<meta name="viewport" content="width=device-width, initial-scale=1.0">

 

코드 넣으신 것 확인하셨나요 ?

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

e
ecoseobu
1개월 전
답변 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인