用于拖放UX的CSS

Question

首先，我应该说我的CSS技能相当缺乏。

问题

我正在使用角拖放指令- 角点滴列表。当我将它切换为一个水平列表时，我尝试拖动框时，dndPlaceholder元素(即灰色框)的样式不像我想要的那样。

普鲁克尔

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;
}

屏幕截图

​

​

期望分辨率

我希望dndPlaceholder与列表中的其他元素垂直对齐。红色方格标志着想要的位置。

Answer 1

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