Drag&的CSS删除UX

时间:2015-06-04 16:36:27

标签: css angularjs debugging drag-and-drop

我应该通过说我的CSS技能相当缺乏来作为序言。

问题

我正在使用角度拖拽drop directive - angular-drop-and-drop-lists。当我将其切换为水平列表时,我试图拖动框,dndPlaceholder元素(即灰色框)的样式并不像我想要的那样。

plunkr

http://plnkr.co/edit/1BuPv6Rr4HoaNgyRzB1t?p=preview

placeholder css

.simple-demo ul[dnd-list] .dndPlaceholder {
    display: inline-block;
    background-color: #ddd;
    min-height: 42px;
    min-width: 100px;
    margin: 1px;
}

截图

screenshot

所需的分辨率

我想要的是dndPlaceholder与列表中的其他元素垂直对齐。红色方块标志着所需的位置。

1 个答案:

答案 0 :(得分:1)

您只需将vertical-align: bottom;添加到.dndPlaceholder样式规则中。