인덱스 페이지에서 section정렬

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
인덱스 페이지에서 section정렬

QA

인덱스 페이지에서 section정렬

본문

인덱스 페이지 날려 먹어서 복구 중인데.... 다행히 제작 해주신쪽에서 완성본은 아니지만 카피파일이 있어 활용중입니다.ㅠㅠ

 

 <h1>나무와 친환경, 그리고 함께하는<br>
친환경소재와 업사이클링으로 환경을 생각하고 함께 이루어가는 기업
</h1>
    <h2>Education Service<br>
eco-friendly products <br>
upcycling service <br>
society together
</h2>
<p>교육하고 실습하여 업사이클링서비스와 친환경제품제작 판매와, <br>
진로, 창업 지원을 제공하여 취약계층의 자립을 지원하고 그들과 환경문제를 함께 풀어가고 있습니다, 
</p>

 

이부분이 화면 가운데 보여져야 하는데 계속 아래처럼 나오네요..ㅠㅠ

2038706226_1672292868.8646.png

warp정렬로 검색도 해보고 이것 저것 넣어봤는데 글씨크기도 마으매로 안되고...ㅠㅠ<h2>만 영문글씨처럼 커지고 다른건 적용이 안되고.....

가운데 정렬도 안되고..ㅠㅠ  

어떻게 해야 하나요~!!!!!

PC에서도 가운데 정렬

Mobile에서도 화면 잘리지 않게 보이고 싶어요!!

도와주세요~~~

 

에디트 플러스에서 확인한 소스입니다.(__)

 

<!--■■■tl_page_box_warp consulting_page■■■ 
<section class="tl_consulting_page_warp">
<div class="inner clearfix">
  <h2 class="aos-init aos-animate" data-aos="fade-right" data-aos-delay="200">BUSINESS CONSULTING</h2>
  <p class="aos-init aos-animate" data-aos="fade-right" data-aos-delay="400">글로벌 비지니스의 시작부터 성공까지</p>
  <ul class="clearfix">
  <li class="aos-init aos-animate" data-aos="fade-up" data-aos-delay="200"><a href="/" class="lt_img"><img src="<?=G5_THEME_URL?>/img/round01.jpg" /></a><p>나아가는 서비스</p></li>
  <li class="aos-init aos-animate" data-aos="fade-up" data-aos-delay="400"><a href="/" class="lt_img"><img src="<?=G5_THEME_URL?>/img/round02.jpg" /></a><p>앞서가는 서비스</p></li>
  <li class="aos-init aos-animate" data-aos="fade-up" data-aos-delay="600"><a href="/" class="lt_img"><img src="<?=G5_THEME_URL?>/img/round03.jpg" /></a><p>성장하는 서비스</p></li>
  <li class="aos-init aos-animate" data-aos="fade-up" data-aos-delay="800"><a href="/" class="lt_img"><img src="<?=G5_THEME_URL?>/img/round04.jpg" /></a><p>함께하는 서비스</p></li>
  <li class="aos-init aos-animate" data-aos="fade-up" data-aos-delay="1000"><a href="/" class="lt_img"><img src="<?=G5_THEME_URL?>/img/round05.jpg" /></a><p>만족하는 서비스</p></li>
  </ul>
</div>
</section>
<!--■■■tl_page_box_warp consulting_page■■■--> 
<!--■■■tl_company_box_warp■■■-->

    <section class="tl_company_box_warp">
     <div class="inner clearfix">
         <h1>나무와 친환경, 그리고 함께하는<br>
친환경소재와 업사이클링으로 환경을 생각하고 함께 이루어가는 기업
</h1>
    <h2>Education Service<br>
eco-friendly products <br>
upcycling service <br>
society together
</h2>
<p>교육하고 실습하여 업사이클링서비스와 친환경제품제작 판매와, <br>
진로, 창업 지원을 제공하여 취약계층의 자립을 지원하고 그들과 환경문제를 함께 풀어가고 있습니다, 
</p>


</section>


<!--■■■tl_company_box_warp■■■--> 

이 질문에 댓글 쓰기 :

답변 2

텍스트가 가운데 정렬을 하고 싶으신거면 저기 해당하는 h1, h2, p에 text-align:center 속성을 넣어주시면 됩니다. 

 

 

저 내용들이 좌측정렬을 한 상태로 가운데 정렬을 하고 싶으신 거면 

.tl_company_box_warp .inner{display:flex;justify-content:center; align-items:center;flex-wrap:wrap;flex-wrap:wrap;}
.tl_company_box_warp .inner h2, .tl_company_box_warp .inner h1, .tl_company_box_warp .inner p{width:100%;}

 

아마 이렇게 처리하면 될것 같은데 지금 css 어떻게 셋팅돼 있는지도 확인해 봐야 됩니다. 

목차1번 가운데정렬 원리에 관해서 30분 정도만 투자해 공부해 보세요.

https://homzzang.com/b/css-254

답변을 작성하시기 전에 로그인 해주세요.
전체 148
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT