Избегайте пересечения границ CSS

Это простой вопрос, я даже думаю, что кто-то задавал это раньше, но он так и не получил реального ответа.

То, что я хочу, это избежать пересечения границ, это так просто. Вот пример:

div{
   width: 400px;
   height: 150px;
   border: 1px solid red;
   border-bottom: 7px solid black;
}

Вы можете видеть, что границы перекрываются в углу.

Вот живой пример:Пример jsFiddle

Что я действительно хочу сделать, так это сделать нижнюю границу закрывающей правую и левую границу. Может кто-нибудь сказать мне, что я могу сделать здесь?

Ответы на вопрос(1)

Ваш ответ на вопрос