먼저 어디에 패딩값과 마진값을 줄여서 여백을 조절할지 찾으실땐,

[크롬]의 개발자환경인 [요소검사](f12)에서 div를 하나하나 찍어 보시면 오른편에 적용된 스타일이 무엇인지

그리고 여백이 어느정도 인지 보시면서 수정하시는게 제일 간편합니다.

크롬의 요소검사로 보시면 css가 어디에 있는 것인지도 나와있습니다.

pc 인지 table인지 mobile인지... 오른쪽 상단에 소속된 정보가 뜨죠

 

첫번째로 문의 주신 새소식 위에 여백을  반사이즈 주려면  아래와 같이

요소보기로 div를 하나하나 열어서 클릭해보면 주황색으로 표시된 여백이 보입니다.

이게 바로 다른애들은 없고 " .main .body " 라는 아이만 가지고 있는 margin값

위쪽 여백을 보여줍니다. css 경로는 layout_pc.css라고 위에도 친절하게 뜹니다.

그러면 css파일관리에 layout_pc.css에 가셔서 .main .body 의 margin : 1em 0 3em 0; 이렇게

윗부분을 2em -> 1em 반값으로 수정하시면 됩니다.

*크롬의 요소보기에서 속성을 임의 수정 삭제 또는 추가도 가능합니다.

 

두번째로 문의주신 정렬 문제는 메인화면 디자인에서 아래와같이 <div>로만 감싸주니 자리를 잡는데요.

만약 서로 간격을 조절하고 싶으시면 <span>이든 <div>든 감싸셔서 class를 따로 지정하시고 margin이나 padding으로 여백을 조절하시면 됩니다.

 

세번째로 문의주신 팝업창은 position:relative; top:20px;만 추가하니 자리를 잡네요.

아래와같이 클래스는 .section_float2 이며 layout_pc.css안에서 수정해 주시길 바랍니다.

 

위에 내용은 PC 기준이며, 일일이 반응형에 따라 설명 드리기 힘드니 크롬의 요소검사(f12)를 보시면서

mobile/table css를 반듯이 수정하셔야 합니다.

감사합니다.