https://lawtech1.blogspot.com/2025/08/5.html

글쓰기 에디터: 미리보기

1. 정확한 제품 또는 플러그인 이름

kboard 게시판

2. 상세 내용

기본 스타일 충돌

1. • KBoard는 워드프레스 테마의 CSS를 그대로 따르지 않고, 자체 스타일시트를 씁니다.

   • 그래서 같은 HTML 구조라도 KBoard 위젯 안에서는 글자 크기, 줄 간격, 마진/패딩이 달라집니다.

2. div 래퍼(wrapper) 차이

   • Tistory나 Blogger에서는 <p>, <div>가 단순히 이어져 출력되지만,

   • KBoard는 <div class="kboard-..."> 같은 추가 래퍼 요소로 감싸기 때문에 불필요한 줄바꿈, margin-bottom 값이 들어갑니다.

3. 화이트스페이스 처리

   • 특히 FAQ처럼 Q: / A: 구조를 쓰면,
     Tistory/Blogger는 텍스트 인라인 흐름으로 보이지만
     KBoard는 줄 간격이 강제로 벌어져 보여 “여백이 많아진 것처럼” 보입니다.

3. 확인 가능한 상세 페이지 주소

경북 근로 특별소송 변호사, 성공적인 선택을 위한 5가지 기준 – geunim

4. 수정한 코드 내역 (있다면)

KBoard 전용 CSS 수정 위치

• 위치: /wp-content/plugins/kboard/template/.../style.css

• 또는 /wp-content/plugins/kboard/css/kboard.css

1. CSS 오버라이드

KBoard 출력되는 부분에만 적용되도록 CSS를 추가해주면 됩니다:

.kboard .faq-block p {
  margin: 0 !important;
  line-height: 1.6;
}
.kboard .faq-block div {
  margin-bottom: 5px !important;
}
 

2. FAQ 블록에 클래스 부여

HTML에 직접 class="faq-block" 같은 래퍼를 달아주고,
KBoard CSS보다 우선 적용되도록 !important 옵션을 쓰면 깔끔하게 통일됩니다.

3. 불필요한 <p> 자동삽입 제거

KBoard는 wpautop 기능 때문에 <br> 대신 <p>를 삽입하기도 합니다.
이럴 땐 글 입력 시 “텍스트 모드”에서 <p> 대신 <br>를 직접 넣으면 여백이 줄어듭니다.

정리하면, KBoard만 다르게 보이는 이유는 KBoard 플러그인의 기본 CSS와 자동 <p> 삽입 때문이에요.
FAQ를 깔끔하게 맞추려면 추가 CSS 오버라이드를 쓰거나, FAQ 전용 클래스 블록을 만들어서 제어하시면 됩니다.