Dies ist eine einfache Frage, ich glaube sogar, dass jemand sie zuvor gestellt hat, aber sie hat nie eine richtige Antwort bekommen.

Ich möchte, dass keine Grenzen überlappen. So einfach ist das. Hier ist ein Beispiel:

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

Sie können sehen, dass sich die Ränder in der Ecke überlappen.

Hier ist das Live-Beispiel:jsFiddle Beispiel

Ich möchte wirklich, dass der untere Rand den rechten und linken Rand abdeckt. Kann mir jemand sagen was ich hier machen kann?