react-beautiful-dnd inconsistent drop zone width
In this example I forked official example from git. I only changed drop zone with to 500px.
The problem is if I grab the beginning of the box, then only a bit more than half of the drop zone is active. 
Same thing happens if I grab the end of the box, then the half left side is inactive. 
But if I grab the middle of the box, the whole box seems to be active.
Is this a bug? Or I missing something from configuration? Maybe CSS?
javascript reactjs react-dnd
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
add a comment |
In this example I forked official example from git. I only changed drop zone with to 500px.
The problem is if I grab the beginning of the box, then only a bit more than half of the drop zone is active.
Same thing happens if I grab the end of the box, then the half left side is inactive.
But if I grab the middle of the box, the whole box seems to be active.
Is this a bug? Or I missing something from configuration? Maybe CSS?
javascript reactjs react-dnd
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
add a comment |
In this example I forked official example from git. I only changed drop zone with to 500px.
The problem is if I grab the beginning of the box, then only a bit more than half of the drop zone is active.
Same thing happens if I grab the end of the box, then the half left side is inactive.
But if I grab the middle of the box, the whole box seems to be active.
Is this a bug? Or I missing something from configuration? Maybe CSS?
javascript reactjs react-dnd
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
In this example I forked official example from git. I only changed drop zone with to 500px.
The problem is if I grab the beginning of the box, then only a bit more than half of the drop zone is active.
Same thing happens if I grab the end of the box, then the half left side is inactive.
But if I grab the middle of the box, the whole box seems to be active.
Is this a bug? Or I missing something from configuration? Maybe CSS?
javascript reactjs react-dnd
javascript reactjs react-dnd
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
asked Nov 20 '18 at 15:37
Mantas ČekanauskasMantas Čekanauskas
1,75751628
1,75751628
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
When dragging with a mouse the impact of an item is based on it's center position. So the center position of an item needs to be over the list for it to be the drop target
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53396472%2freact-beautiful-dnd-inconsistent-drop-zone-width%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
When dragging with a mouse the impact of an item is based on it's center position. So the center position of an item needs to be over the list for it to be the drop target
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
add a comment |
When dragging with a mouse the impact of an item is based on it's center position. So the center position of an item needs to be over the list for it to be the drop target
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
add a comment |
When dragging with a mouse the impact of an item is based on it's center position. So the center position of an item needs to be over the list for it to be the drop target
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
When dragging with a mouse the impact of an item is based on it's center position. So the center position of an item needs to be over the list for it to be the drop target
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
answered Nov 21 '18 at 8:55
alexreardonalexreardon
306110
306110
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
add a comment |
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Bonus: if you don’t want a dead zone between the lists then have them set next to each other. Margin between them is fine
– alexreardon
Nov 21 '18 at 8:57
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
Is there a way to make the whole drop zone available when grabbing not on box center, but one of the side? Also just noticed, if I grab box from left list on box's very right side and move it to left side of the right list, the left list is still a drop zone. even though mouse is already in right list.
– Mantas Čekanauskas
Nov 21 '18 at 9:40
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
The mouse grab position is not considered. Only the items center of mass
– alexreardon
Nov 21 '18 at 11:45
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
Please mark this answer as correct - because it is :)
– alexreardon
Dec 12 '18 at 0:23
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
I'll take your word for it's correctness ;)
– Mantas Čekanauskas
Dec 12 '18 at 10:05
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53396472%2freact-beautiful-dnd-inconsistent-drop-zone-width%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
