vertical separator in datagrid toolbar

[crosemffet]

hello
I need to ad vertical separator in datagrid toolbar;
I know horizontal separator is: <div class="menu-sep"></div>, but what is vertical separator equivalent...?
<div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">Remove User</a>
    | --> here I want vertical separator
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" disabled="true" onclick="destroyUser()">All</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="destroyUser()">Enabled</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="destroyUser()">Disabled</a>
    | --> here I want vertical separator
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="destroyUser()"><?php echo $textows[40];?></a>
</div>

[stworthy]

Please try this:

Code:

<style>
	.l-btn{
		vertical-align:middle;
	}
	.button-sep{
		display:inline-block;
		width:0;
		height:22px;
		border-left:1px solid #ccc;
		border-right:1px solid #fff;
		vertical-align:middle;
	}
</style>
<div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">Remove User</a>
    <span class="button-sep"></span>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" disabled="true" onclick="destroyUser()">All</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="destroyUser()">Enabled</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="destroyUser()">Disabled</a>
    <span class="button-sep"></span>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="destroyUser()"><?php echo $textows[40];?></a>
</div>

[JeroenNL]

Excellent example code: just what I was looking for.