# 블럭 기본 여백 변경하기 (기본 여백 제거)

블럭의 여백은 상세 설정에서 수정할 수 있는데요.

다만, 상단과 하단 여백을 0으로 설정하여도 기본 여백으로 인해 28px의 여백이 더 남아있습니다.

[![dc6a6489640ca02b0d42dabeb8e46bb7.jpg](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/dc6a6489640ca02b0d42dabeb8e46bb7.jpg)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/dc6a6489640ca02b0d42dabeb8e46bb7.jpg)

<span style="color: rgb(22, 145, 121);">\[닷홈빌더 블럭의 기본 여백\]</span>

이 부분은 편집기에서는 줄일 수 없고 별도의 css를 추가해 주어야 해요!

css를 추가하면 편집 화면에서는 이 여백 값을 줄일 수 없지만 실제 페이지에서 여백 값을 줄여서 보여줄 수 있어요!

[![기본여백제거01.jpg](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/y6r01.jpg)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/y6r01.jpg)

<span style="color: rgb(22, 145, 121);">\[닷홈빌더 공통코드 입력 화면\]</span>

닷홈빌더 관리자에서 홈페이지 설정 &gt; 공통코드 입력 페이지로 이동하여 아래에서 해당하는 코드를 추가한 뒤 저장해 주세요.

<div id="bkmrk--3">  
</div><div id="bkmrk-%5B%EB%AA%A8%EB%93%A0-%EB%B8%94%EB%9F%AD%EC%9D%98-%EC%97%AC%EB%B0%B1%EC%9D%84-%EC%A1%B0%EC%A0%88%ED%95%98%EB%A0%A4%EB%8A%94-%EA%B2%BD%EC%9A%B0"><div>**\[모든 블럭의 여백을 조절하려는 경우\]**</div></div><div id="bkmrk--4"><div>  
</div><div>  
</div></div>```
<style>
.section .section-inner .h-con{padding-top: 상단여백크기px; padding-bottom: 하단여백크기px}
</style>
```

<div id="bkmrk-%5B%ED%8A%B9%EC%A0%95-%EB%B8%94%EB%9F%AD%EC%9D%98-%EC%97%AC%EB%B0%B1%EC%9D%84-%EC%A1%B0%EC%A0%88%ED%95%98%EB%A0%A4%EB%8A%94-%EA%B2%BD%EC%9A%B0"><div>  
</div><div>  
</div><div>  
</div><div>**\[특정 블럭의 여백을 조절하려는 경우\]**</div><div>  
  
</div></div>```
<style>
#변경하려는블럭의ID .section-inner .h-con{padding-top: 상단여백크기px; padding-bottom: 하단여백크기px}
</style>
```

<div id="bkmrk-%2A%EB%B8%94%EB%9F%ADid-%ED%99%95%EC%9D%B8%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95%EC%9D%80%C2%A0%EC%97%AC%EA%B8%B0%EB%A5%BC-%EC%B0%B8"><div>*블럭ID 확인하는 방법은 [<span style="color: #3984c6;"><u>**여기**</u></span>](https://docs.dothome.co.kr/books/09/page/id)를 참고하세요.</div><div>  
</div><div>  
</div><div>  
</div><div>  
</div><div>**\[모바일 전용 블럭의 여백을 조절하려는 경우\]** </div><div>  
</div></div>```
<style>
.msection .section-inner .h-con{padding-top: 상단여백크기px; padding-bottom: 하단여백크기px}
</style>
```

<div id="bkmrk--5"><div>  
</div></div><div id="bkmrk--6">  
</div><div id="bkmrk--7">  
</div><div id="bkmrk--8">  
</div><div id="bkmrk--9">---

</div><div id="bkmrk--10">  
</div><div id="bkmrk-%5B%EB%B3%80%EA%B2%BD%EB%90%9C-%EB%AA%A8%EC%8A%B5%5D">**\[변경된 모습\]**</div><div id="bkmrk--11"></div>[![58238e9ae2dd305d79c2ebc8c1883422_1.jpg](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/Js758238e9ae2dd305d79c2ebc8c1883422-1.jpg)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/Js758238e9ae2dd305d79c2ebc8c1883422-1.jpg)

<div id="bkmrk-%5B%EB%8B%B7%ED%99%88%EB%B9%8C%EB%8D%94-%EB%B8%94%EB%9F%AD%EC%9D%98-%EA%B8%B0%EB%B3%B8-%EC%97%AC%EB%B0%B1%EC%9D%B4-%EC%A0%9C%EA%B1%B0%EB%90%9C"><span style="color: rgb(22, 145, 121);">\[닷홈빌더 블럭의 기본 여백이 제거된 화면\]</span></div><div id="bkmrk--14"></div><div id="bkmrk-%EC%97%AC%EB%B0%B1%EC%9D%84-0%EC%9C%BC%EB%A1%9C-%EC%84%A4%EC%A0%95%ED%95%98%EB%A9%B4-%EC%9C%84%EC%99%80-%EA%B0%99%EC%9D%B4-%EC%A1%B0">여백을 0으로 설정하면 위와 같이 조절된답니다!</div><div id="bkmrk--15"></div><div id="bkmrk-%EB%8B%A4%EB%A7%8C%2C-%EC%95%9E%EC%84%9C-%EC%84%A4%EB%AA%85%ED%95%9C-%EA%B2%83%EA%B3%BC-%EA%B0%99%EC%9D%B4-%ED%8E%B8%EC%A7%91%ED%99%94">다만, 앞서 설명한 것과 같이 편집화면에서는 기본 여백이 그대로이고, 실제 페이지에서만 변경되는 것이니 이점 참고해 주세요~</div><div id="bkmrk--16"></div>