Цвет фона с закругленными краями

Question

У меня есть модал, как указано ниже.

<div class="modal fade" id="myModal">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content">

        <!-- Modal Header -->
        <div class="modal-header">
          <h4 class="modal-title"><b>Outage Details</b></h4>
        </div>

Я пытаюсь изменить цвет фона модального заголовка, используя указанный CSS

.modal-header
{
    background-color : #0063C3
}

Работает нормально, но цвет не заполняет полностью до краев.Вы можете увидеть белый цвет по краям.Скриншот ниже для справки.Как мы можем полностью заполнить модальный заголовок цветом фона?

введите описание изображения здесь

Answer 1

Вам нужен класс rounded-0 для удаления закругленных углов ..

   <div class="modal-header rounded-0">
         <h4 class="modal-title"><b>Outage Details</b></h4>
   </div>

Демонстрация: https://www.codeply.com/go/XHvAXID48s

Answer 2

Это может быть результатом border-radius.Попробуйте удалить border-radius вот так

.modal-header
{
    background-color : #0063C3;
    border-radius:0!important;
}