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

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

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

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

2024.04.12 11:17:35 14840 (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;}