Блог

У меня здесь есть JSFiddle:

https://jsfiddle.net/1pm0vsf3/1/

Я использую стандартный вариант, а именно buttonImage :

https://api.jqueryui.com/datepicker/

но значок моего календаря отображается в новой строке:

Как мне сделать так, чтобы значок моего календаря отображался в той же строке?

Добавьте это в свой CSS:

 .col-10::after {
  clear: both;
  content: ' ';
  display: block;
}
input.key-event-datepicker {
  float: left;
  margin-right: 5px;
}
 

Это добавляет плавающий к вашему вводу, сообщая кнопке, что она может плавать рядом с вашим вводом. Элемент after в col-10 очищает значение с плавающей точкой, поэтому оно не влияет на высоту родительского контейнера.
Возможно, вам все же следует использовать более уникальный идентификатор для вашего col-10, поскольку теперь это добавит значение с плавающей запятой для всех ваших col-10.
Обновленный JS Fiddle: https://jsfiddle.net/obmajt1w /