Как убрать часть границы от элемента

Question

Как убрать часть верхней границы элемента p которая находится под h3?

h3,
p {
  margin: 0;
  background-color: #c9e39c;
  border: 2px solid rgba(0, 128, 0, 0.103);
  padding: 5px 5px;
}

h3 {
  display: inline-block;
  border-radius: 6px 6px 0 0;
  border-bottom: none;
}

p {
  text-align: justify;
  border-radius: 0 0 6px 6px;
  width: 250px;
}

<h3>Заголовок</h3>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eum voluptates facere quisquam sint. Ullam pariatur repellendus ratione repellat, tenetur doloremque suscipit optio incidunt quod placeat.</p>

Answer 1

Убрать часть границы не получится, но можно её перекрыть: задать заголовку position: relative и спустить его на 2px вниз:

h3,
p {
  margin: 0;
  background-color: #c9e39c;
  border: 2px solid rgba(0, 128, 0, 0.103);
  padding: 5px 5px;
}

h3 {
  display: inline-block;
  border-radius: 6px 6px 0 0;
  border-bottom: none;
  position: relative;
  bottom: -2px;
}

p {
  text-align: justify;
  border-radius: 0 0 6px 6px;
  width: 250px;
}

<h3>Заголовок</h3>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eum voluptates facere quisquam sint. Ullam pariatur repellendus ratione repellat, tenetur doloremque suscipit optio incidunt quod placeat.</p>

БЛОГ НА HUSL

Как убрать часть границы от элемента

Ответы (1 шт):