창 크기를 조정하면 웹 사이트 콘텐츠가 이동합니다.

Question

웹 사이트를 만들었고 창 크기가 조정될 때마다 웹 사이트의 콘텐츠가 이동하고 주문한 상태가 아니므로 문제가 있습니다.

이 문제를 해결하려면 어떻게해야합니까? 감사합니다.

<section class="nav-panel nav-color" id="nav-panel-2"> 
    <div class="img"> 
     <a target="_blank" href="images/Starters/starters1.jpg"> 
     <img src="images/Starters/starters1.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Fried Ravioli</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/Starters2.jpg"> 
     <img src="images/Starters/starters2.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Cheese Bread</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/breadsticks.jpg"> 
     <img src="images/Starters/breadsticks.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Garlic Bread</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/mozzarellaSticks.jpg"> 
     <img src="images/Starters/mozzarellaSticks.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Mozzarella Sticks</div> 
    </div> 

    <div class="img"> 
     <a target="_blank" href="images/Starters/wings.jpg"> 
     <img src="images/Starters/wings.jpg" alt="Restaurant" width="600" height='auto'> 
     </a> 
     <div class="desc">Chicken Wings</div> 
    </div> 
    </section> 

Answer 1

당신은 당신의 CSS에 일해야 : 여기

내 webite에서 코드 샘플입니다. 플로트, 높이, 너비, 최대 너비 등을 편집하여 반응 형 웹 사이트를 만드십시오. 웹 사이트의 매력을 높이려면 JQuery와 같은 JavaScript 및 플러그인을 사용해야합니다.

일반적으로이 질문을 통해 답변이나 답변을 얻지 못할 수도 있습니다. 반응 형 웹 개발에 대한 자습서 또는 무언가에 참여하십시오.

Answer 2

요소를 가운데 맞추기 위해 여백 및 패딩 특성을 사용하지 마십시오. 래퍼 div를 만든 다음 여백을 설정합니다. 0 auto; 그것에.

Answer 3

위치에 절대 또는 고정 스타일을 지정할 수 있습니다. 예. #div{ position:absolute; }