Проблема смещения Jquery + Css Drag and Drop

ОБНОВЛЕНИЕ: я обновил jsfiddle, чтобы сделать его более понятным. Для уточнения вопроса. Когда плитка перетаскивается из нижнего ряда в верхний ряд, это приводит к тому, что выпадающий элемент div смещается вниз относительно других элементов div. Когда все три элемента div заполнены, они снова становятся встроенными. Что вызывает смещение div, когда заполнены только один или два div?

Сейчас я изучаю jquery drag and drop.

Проблема в том, что когда я захожу в свой div, он создает offset в droppable divs.

Вы можете увидеть проблему в jsfiddle, который я создал, ссылка ниже. Я новичок в jquery и перетаскивании, поэтому имейте это в виду, если мой код поврежден.

jsfiddle


drag-and-drop jquery css jquery-ui-draggable
person Brent    schedule 27.03.2018    source источник
comment
Пожалуйста, четко объясните свою проблему. У вас два $( ".trash" ).droppable and $( ".GridDiv" ).droppable, и я не вижу вашей проблемы.   -  person Ali Soltani    schedule 28.03.2018
comment
Спасибо, что посмотрели пост и файл jsfiddle. Я очистил jsfiddle и добавил обновление, чтобы прояснить вопрос/проблему.   -  person Brent    schedule 29.03.2018

Ответы (1)


arrow_upward
1
arrow_downward

Вы можете исправить это, как показано ниже:

.componentHolder {
  width: 100px;
  height: 120px;
  border: 1px solid black;
  padding: 0px;
  margin: 0px;
  float: left; // I used float instead of inline-block
}

Онлайн-демонстрация (jsFiddle)

person Ali Soltani    schedule 29.03.2018
comment
Большое тебе спасибо! Это именно то, что было нужно. - person Brent; 29.03.2018
comment
@ Брент Добро пожаловать. Пожалуйста, проголосуйте за мой ответ, чтобы узнать, что другие люди помогают вам, потому что некоторые люди видят только ответы, за которые проголосовали. - person Ali Soltani; 29.03.2018