问题描述:EasyUI toolbar中添加分隔线时,分隔线会自动跑到最左边。
解决方案一:
使用一个table来创建toolbar,
<div id="toolbar">
<table>
<tr>
<td>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onClick="javascript:add();">添加</a>
</td>
<td>
<div class="datagrid-btn-separator"></div>
</td>
<td>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onClick="javascript:upd();">修改</a>
</td>
</tr>
</table>
</div>
解决方案二:
改变分隔线样式,
<div id="toolbar">
<div>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onClick="javascript:add();">添加</a>
<span class="datagrid-btn-separator" style="vertical-align: middle;display:inline-block;float:none"></span>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onClick="javascript:upd();">修改</a>
</div>
</div>
比较:工具栏工具按钮较多,而窗口又较小时,方案二较好(因为它会分行显示)。