묻고답하기

html, css 공부 후 복습겸 사이트를 하나 만들고있는데, full 화면일때는 괜찮다가 화면을 줄이면 사진 빼고 모든 택스트가 밀려버립니다.

근데 위아래로 줄이면 안밀리더라구요.

네이버나 구글 같이 창을 줄이면 글자가 안밀리고 안보이는 그대로 창만 줄어들었으면 좋겠는데 해결책을 도통 모르겠습니다.

구글링 몇시간 해서 하라는거 다 해봐도 안되네요.

 

전체화면.JPG

 

잘린화면.JPG

 

 코드는 보시는 페이지의 코드입니다. 제발 도와주세요..

 

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title>NightTable.com/menu</title>

    <link href="https://fonts.googleapis.com/css2?family=Yeon+Sung&display=swap" rel="stylesheet">

    <link rel="stylesheet"  href="active.css">

 

    <style>

      h1{

        margin-top: 40px;

        padding-top: 0px;

        font-size: 120px;

        padding-bottom: 10px;

        padding-left: 50px;

        font-family: 'Yeon Sung', cursive;

        margin-bottom: 0;

        display: inline-block;

      }

      h2{

        font-size: 35px;

        border-bottom: solid black 3px;

        padding-bottom: 12px;

        padding-left: 60px;

        margin-bottom: 10px;

        font-family: 'Yeon Sung', cursive;

        display: inline-block;

      }

      a{

        color:black;

        text-decoration: none;

      }

      #img{

        margin-left: 0;

        margin-bottom: 0;

        margin-top: 0;

      }

      body{

        margin-left: 0;

        margin-right: 0;

      }

      li{

        font-size: 50px;

        padding-bottom: 20px;

        font-family: 'Yeon Sung', cursive;

      }

      ul{

        padding-left: 80px;

      }

      #bigmenu{

        font-family: 'Yeon Sung', cursive;

        position:absolute;

        left:950px;

        top:230px;

        font-size:25px;

        text-decoration: underline;

        font-size:50px;

      }

      #pasta{

        position:absolute;

        left:520px;

        top:320px;

        border-radius: 10%;

    overflow: hidden;

      }

      #meat{

        position:absolute;

        left:880px;

        top:320px;

        border-radius: 10%;

    overflow: hidden;

      }

      #ttuk{

        position:absolute;

        left:1240px;

        top:320px;

        border-radius: 10%;

    overflow: hidden;

      }

      #menuname{

        font-family: 'Yeon Sung', cursive;

        position:absolute;

        left:590px;

        top:495px;

        font-size:30px;

        font-decoration:strong;

      }

      #menudetail{

        font-family: 'Yeon Sung', cursive;

        position:absolute;

        left:520px;

        top:545px;

        font-size:23px;

 

      }

      #samallmenu{

        font-family: 'Yeon Sung', cursive;

        position:absolute;

        left:520px;

        top:645px;

        font-size:23px;

        border-top: 4px solid black;

 

      }

      }

      </style>

  </head>

  <body>

 

    <h1><a href="index.html">밤식탁</h1></a>

    <h2>골목 작은 술집</h2>

    <br>

 

    <ul>

      <li><a href="description.html">밤식탁</li></a>

      <li id="active"><a href="menu.html" id="active">메뉴</li></a>

      <li><a href="howtocome.html">찾아오는길</li></a>

      <li><a href="launchguide.html">창업안내</li></a>

      <div style="width:1280px; overflow-x:auto">

      <u><div id="bigmenu">대표 메뉴</div></u>

    </div>

      <div id="pasta"><img src="pasta.jpg" width="310" height="180"></div>

      <div id="meat"><img src="meat.jpg" width="310" height="180"></div>

      <div id="ttuk"><img src="ttuk.jpg" width="310" height="180"></div>

      <div id="menuname"><p><strong>청양 크림 파스타</strong>     

                <strong>부추 훈제 삼겹</strong>

                  

          <strong>해물 그라탕 떡볶이</strong>

        </p></div>

 

      <div id="menudetail"><p>고추의 알싸함으로 느끼함을 잡은 한국식    

        직접 짠 들기름으로 무친 부추&볶음김치 삼합   

        밤식탁만의 특제 로제 소스 베이스로 만든<br>         

        밤식탁 파스타

              

                  

               

              

                 시그니처 메뉴<br></p></div>

 

      <div id="samallmenu"><br><p><strong>순.정.파</strong> : 순두부찌개와 정말 파스타 면이 들어간 정말 맛있는

        매운 국물 파스타            

                          

              <br><br>

        <strong>대패삼겹볶음&주먹밥</strong> : 대패삼겹살과 각종 채소, 주먹밥이 들어간 매콤한 볶음 요리<br><br>

        <strong>버터바지락술찜&파스타(겨울)</strong> : 생물바지락을 이용한 칼칼한 술찜요리<br><br>

        <strong>나가사끼짬뽕탕</strong> : 해물가득 칼칼한 짬뽕탕<br><br>

        <strong>얼큰해물짬뽕탕</strong> : 고추, 파기름으로 볶아낸 채소와 해물을 넣은 빨간 짬뽕<br><br>

        <strong>사골만두탕</strong> : 진한 사골에 비비고 만두를 넣은 맛있는 만두탕<br><br>

        <strong>철판모듬소세지</strong> : 버터로 볶아낸 양파와 모듬소세지<br><br>

        <strong>골뱅이무침</strong> : 새콤달콤하게 무친 채소와 골뱅이무침<br><br>

        <strong>오늘의 과일&요거트</strong> : 달콤한 생크림 요거트에 찍어먹는 싱싱한 제철과일<br><br>

        <strong>간장계란밥</strong> : 계란후라이와 간장, 고소한 기름으로 맛을 낸 든든한  계란밥<br><br>

        <strong>얼큰우동</strong> : 가게에서 직접 만드는 얼큰한 어묵 우동<br><br>

 

 

    </div>

    </ul>

  </body>

</html>

 
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
최갑균 글 작성시 태그를 쓰면 글이 등록이 안됩니다. file  
park 로그인이안됩니다.  
키미즈 출석부 - 출석은 했는데 개근일(연속출석일)이 반영이 안됩니다. [1] 2021.02.15 by 봄비
봄비 소시랑 출석부 개근 0일 버그 file  
김완수 로그인시 기본url이 설정 되지 않았습니다. 문제 어떻게 해결하나요? [2] 2021.02.13 by 김완수
부산하늘 게시글 링크주소 클릭하면 xe 메인화면으로 갑니다~ [1] 2021.02.13 by sejin7940
용용 서버 이전 작업 시 에러 [1] 2021.02.13 by sejin7940
건즈 게시판 맨 아래에 글쓴이에 관해 소개 나오는 섹션은 어떻게 수정하나요? [1] file 2021.02.13 by sejin7940
hssc 첨부파일 여러개를 리스트에 출력하려면? [1] file 2021.02.13 by sejin7940
ark 자료실 다운로드,쉬운설치  
위즈콘 플래쉬 중단으로 파일첨부 버튼 동작하지 않아요 [4] 2021.02.09 by 봄날은간다
pwy 모바일 확대 뷰포트 기능 관련 문의드립니다...ㅠㅜ  
railman 마켓플레이스에서 물품 대표사진 등록이 안되는 현상  
ark DB 사용법  
맥전도사 안녕하세요^^ 업데이트 자문 구합니다 [5] 2021.02.05 by 맥전도사
모비딕 xe 1.4.5.7 게시판 첨부파일 플래시 기능 작동이 되지 않습니다. [3] 2021.02.05 by sejin7940
railman 분류에서 "전체"버튼 삭제하는 방법 [2] file 2021.02.04 by railman
railman 파비콘이 위치하는 herf에는 상대경로가 아닌 절대경로를 사용해야 합니다.  
자뇽 1.2.3 업데이트 [2] 2021.02.04 by 자뇽
희망KH XE core '1.7.4' 버전 파일첨부 버튼이 동작하지 않아요 [1] 2021.02.03 by sejin7940
리즈먀 XE에서 카운트 업 기능을 사용할 수 있을까요?  
리즈먀 XE core 업데이트 문의 [2] 2021.02.02 by 리즈먀
달걀말이 하단 풋터 로고사이즈 문의 [2] 2021.02.02 by 달걀말이
연어 업데이트후 홈페이지 오류가 생겼습니다 [1] 2021.02.01 by sejin7940
듀엣라이프 호스트 이름에 따라 다른 모듈을 불러올 수 있나요? [1] 2021.01.30 by 듀엣라이프
둘리 쇼핑몰 상세페에지 엑셀에서 html을 통해 제작.  
이효석974 도와주세요. 제 도메인으로 접속하면... [7] 2021.01.28 by erpsoftware
railman 분류 표시 삭제 및 타이틀 죄측으로 이동 [4] file 2021.01.27 by railman
maverick ZBXE VERSION 1.1.5 업그레이드 문의 [1] 2021.01.27 by sejin7940
dd**** 모바일에서 반응형이 아닌 pc모드로만 고정하는 방법이요~ [3] 2021.01.25 by 박규형