Как удалить нижнюю границу окна с помощью CSS

У меня есть прямоугольный div, как показано выше. Я хочу удалить нижнюю границу (от C до D) в моем div. Как я могу это сделать?.

Редактировать: вот мой CSS:

#index-03 {
  position: absolute;
  border: .1px solid #900;
  border-width: .1px;
  border-style: solid;
  border-color: #900;
  left: 0px;
  top: 102px;
  width: 900px;
  height: 27px;
}

<div id="index-03" 
     style="background-color:limegreen; width:300px; height:75px;">
</div>

Ответы

Ответ 1

Просто добавьте: border-bottom: none;

#index-03 {
    position:absolute;
    border: .1px solid #900;
    border-bottom: none;
    left:0px;
    top:102px;
    width:900px;
    height:27px;
}

Ответ 2

Кажется, вы неправильно поняли коробчатую модель - в CSS вы указываете точки для верхнего и левого, а затем по ширине и высоте - это все, что необходимо для размещения ящика с точными измерениями.

Свойством width является ваш C-D, но он также является A-B. Если вы опустите его, div не будет иметь определенной ширины, а ширина будет определяться его содержимым.

Обновление (после комментариев по вопросу:

Добавьте border-bottom-style: none; в свой CSS, чтобы удалить этот стиль только снизу.

Ответ 3

Вы можете просто установить ширину в auto. Тогда ширина div будет равна 0, если у нее нет содержимого.

width:auto;

Ответ 4

Вы можете установить

border-bottom: none;

или же

border-bottom: 0;

Один устанавливает border-style на none.
Один устанавливает border-width 0px.

div {
  border: 3px solid #900;

  background-color: limegreen; 
  width:  28vw;
  height: 10vw;
  margin:  1vw;
  text-align: center;
  float: left;
}

.stylenone {
  border-bottom: none;
}
.widthzero {
  border-bottom: 0;
}

<div>
(full border)
</div>
<div class="stylenone">
(style)<br><br>

border-bottom: none;
</div>
<div class="widthzero">
(width)<br><br>
border-bottom: 0;
</div>