如何使图片能左右分开，谢谢

门户首页有一个版块，目前图片左右中间不能够分开，不知道怎么弄，我使用的是未来科技的：旅游门户Win8时尚版 X3商业版980px宽GBK 模板。现在的情况是



我想达到的效果是：



目前这个模块的代码是：
<style type="text/css">
.vk_pic_list_1_10_title { }
.vk_pic_list_1_10_title li {  position:relative; float: left;  margin: 0 0px 10px 0px; }
.vk_pic_list_1_10_title li img {background: #fff; border: 0px solid #333;/* -moz-border-radius:5px; -webkit-border-radius:5px; border-radius: 5px; box-shadow: 1px 1px 3px #afafaf; */cursor: pointer; }
.vk_pic_list_1_10_title li:hover img { border-color:#000; }
.vk_pic_list_1_10_title em  { /*display: none; */  background-color:#fff; position:absolute; left:0px; bottom:0px; width:100% ; height:40px ; text-indent:5px; line-height:40px; font-size:16px;  color:#000; overflow:hidden; opacity:.80;filter:alpha(opacity=80);}
.vk_pic_list_1_10_title li:hover em  { display: block; }
.ie7 .vk_pic_list_1_10_title span, .ie7 .vk_pic_list_1_10_title em  { bottom:0px; }
.vk_pic_list_1_10_title li:hover em { background-color:#000; color:#fff; text-decoration:none; }
.vk_pic_list_1_10_title em:hover { color:#fff; text-decoration:none; }
</style>
<div class="vk_pic_list_1_10_title cl">
<ul>
[loop]
<li style="width: {picwidth}px;">
<a href="{url}"><img src="{pic}" width="{picwidth}" height="{picheight}" alt="{title}" ></a>
</li>
[/loop]
</ul>
</div>

咨询模板开发者，QQ一直忙着，木有时间回复我，只好来这里求助了，期盼大师们给与指点。

直接找作者！这个需要修改CSS

建议楼主直接找作者！这个需要修改CSS
若需要协助，也可找我，不过需要付费

谢谢楼上的两位指点，搞定！这个不是CSS的问题，这个代码有bug, 不能二次编辑, 二次编辑之后就变形了！