Как сделать div в центре на всю ширину между соседними?

Question

[Valery23]

Есть код:

<div class="ob_item_product">
     <div class="ob_item_product_tekst">Длина</div>
     <div class="midle_product"></div>
     <div class="ob_item_product_znachenie">222666</div>
</div>
<div class="ob_item_product">
     <div class="ob_item_product_tekst">Длина и Ширина</div>
     <div class="midle_product"></div>
     <div class="ob_item_product_znachenie">66</div>
</div>

.ob_item_product {
    border: 1px solid #dcdcdc;
    margin-top: -1px;
    padding: 7px 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.midle_product {
    border-bottom: 2px dashed #000000;
}

Как сделать центральный div на всю ширину? Что бы border был от первого div до третьего в независимости от их длинны.

Answer 1

[L1nks]

так?

Comments

[Valery23]

Совершенно верно. А оно на всех браузерах будет норм отображаться?

[L1nks]

да, должно во всех.

Answer 2

[MagicMight]

.ob_item_product {
    border: 1px solid #dcdcdc;
    margin-top: -1px;
    padding: 7px 15px;
    display: grid;
    grid-template-columns: auto 1fr auto;
}

.midle_product {
    border-bottom: 2px dashed #000000;
}