그누보드 QA - sticky 오류 분명 됬었는데 안되요ㅠ

sticky 오류 분명 됬었는데 안되요ㅠ

sliverzero 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2024.04.12 11:17:35 18795 (61.♡.♡.171)

답변 3

본문

sticky가 되었었는데 몇주후에 다시 들어가보니 안됩니다..

history_fix가 고정되고 history_move가 연혁텍스트 부분입니다

찾아보다가 flex면 안된다고 align-self를 추가해야된다해서 수정했는데도 안됩니다ㅜ

flex를 포기할 수 는 없고,,

어떤 오류일까요 도와주십쇼 고수님들 ㅠㅠ


<section id="sub0102">
  <div class="con_title">
    <img src="<?php echo G5_IMG_URL ?>/con_title_icon.png" alt="icon">
    <p class="kr">연혁</p>
  </div><!-- con_title -->
  <section id="sub_sec" class="sub0102_sec sub01_con01">
    <div class="history_fix">
      <p class="his_article">상하수도 자동화 및 재난 재해 방재 전문 기업</p>
      <p class="his_title">SINNOTECH</p>
      <p class="his_desc">
        오랜 기간 쌓아온 경험과 노하우를 기반으로<br />
        기술 개발은 물론 지자체 및 공공기관 적용과<br />
        제품의 우수성, 신뢰성 및 안정성을<br />
        검증받으며 발전해 나가고 있습니다.
      </p>
    </div><!-- history_fix -->
    <div class="history_move">
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2018</p>
        </div>
        <ul>
          <li>성능인증(인천-20180180-2-01)</li>
          <li>조달우수제품지정(제2018174호)</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1500">
        <div class="year">
          <p>2017</p>
        </div>
        <ul>
          <li>민관공동투자기술개발사업 성공(S2363159)<br />
            “현장 맞춤형 무선 원격 감시제어장치 기술개발＂</li>
          <li>물관리 우수상 수상(K-water)</li>
          <li>K-water 성능검증제품 인증 브랜드 사용 승인</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2016</p>
        </div>
        <ul>
          <li>특허 제101589127호 등록</li>
          <li>민관공동투자기술개발사업 성공(S2155127)<br />
            "체크밸브 개폐특성 모니터링 및 진단장치 개발"</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2014</p>
        </div>
        <ul>
          <li>기술혁신형 중소기업(INNO-BIZ)인증,벤처기업 재확인</li>
          <li>특허 제101459579호 등록</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2013</p>
        </div>
        <ul>
          <li>ISO 9001,14001 인증</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2012</p>
        </div>
        <ul>
          <li>자본금 255백만원 으로 증자</li>
          <li>중소기업 중앙회 전산업무개발 직접생산 확인등록</li>
          <li>특허 제101171884호 등록</li>
          <li>기업 부설 연구소 설립(한국산업기술진흥협회)</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2010</p>
        </div>
        <ul>
          <li>공장등록 (유무선 원격감시제어장치 외)</li>
          <li>중소기업 중앙회 계장제어장치,유무선원격제어장치,<br />자동제어반 직접생산 확인등록</li>
          <li>정보통신 공사업 등록</li>
          <li>벤처기업 확인</li>
          <li>소프트웨어 사업자 신고 확인서 발급</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2009</p>
        </div>
        <ul>
          <li>자본금 150백만원 으로 증자</li>
          <li>본점이전 (인천광역시 부평구 부평대로 283 B동 911호)</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2008</p>
        </div>
        <ul>
          <li>특허 제100797602호 등록</li>
        </ul>
      </div><!-- history_con -->
      <div class="history_con" data-aos="fade-down" data-aos-duration="1000">
        <div class="year">
          <p>2006</p>
        </div>
        <ul>
          <li>계장제어장치 제조업 등의 목적으로 “주식회사 씨노텍” 설립</li>
        </ul>
      </div><!-- history_con -->
    </div>
  </section>
</section>


#sub0102 {width: 1400px; margin: 0 auto;}
#sub0102 .sub01_con01 {display: flex; flex-wrap: wrap; position: relative;}
#sub0102 .history_fix {width: 50%; height:1000px; background: url('../img/sub0102_bg.png') no-repeat center center; padding-top: 222px; position: sticky; top: 0; left: 0; align-self: flex-start;}
#sub0102 .history_fix .his_article {font-size: 22px; font-weight: 500;}
#sub0102 .history_fix .his_title {font-size: 68px; font-weight: 700; font-family: 'Roboto'; margin-bottom: 38px;}
#sub0102 .history_fix .his_desc {font-size: 18px; color: var(--back-color); line-height: 28px;}
#sub0102 .history_move {width: 50%;}
#sub0102 .history_move .history_con {display: flex; flex-wrap: wrap; gap: 60px; padding-bottom: 28px; border-bottom: 1px dashed #aeaeae; margin-bottom: 35px;}
#sub0102 .history_move .history_con .year p {font-size: 28px; font-weight: 700;}
#sub0102 .history_move .history_con ul {padding-top: 3px;}
#sub0102 .history_move .history_con ul li {font-size: 18px; margin-bottom: 15px; line-height: 26px;}
#sub0102 .con_title, #sub0103 .con_title {margin-bottom: 30px;}