Html 对齐图像旁边的按钮

我在对齐来自jscript源的按钮和小图像时遇到一些问题。。。这里有一个指向右侧照片滑块的链接，粉红色按钮需要与预览图像对齐：

代码如下：

<div id="photos-preview">
            <input class="photos-btn" type="button" onclick="slidePrev();" value="&lt;&lt;" />
            <% for i = 0 to ubound(images)
            %><img src="/includes/tn.asp?src=<%=server.URLEncode(images(i))%>&amp;w=30" style="margin:3px;cursor:pointer" onclick="$('.MainImage').fadeOut(500).hide(0,function(){$('#MainImage<%=images(i)%>').fadeIn(500)});" /><%
            next %>
            <input class="photos-btn" type="button" onclick="slideNext();" value="&gt;&gt;" />
        </div>

---

非常感谢您的任何想法。

为“下一步”和“上一步”按钮制作2个css

并将以下内容添加到css中

photo btn prev{
浮动：左；
}

---

photo btn next{float:right；}

尝试添加

垂直对齐：顶部对于
.photos btn
请尝试以下css：

 #photos-preview img, #photos-preview input {
    vertical-align: middle;
}

以下是预览：

将.photos btn css类更改为：

.photos-btn {
    background-color: #B21589;
    cursor: pointer;
    color: white;
    font-size: 9px;
    font-weight: bold;
    padding: 4px;
    margin-top: 2px;
    vertical-align: top;
}

@Sue D-不是问题-firebug是解决此类问题的非常宝贵的工具，无需更改CSSfile@Sue不客气。有选择的可能性总是好的！：D接受你所实施的一个，并给其他好的答案投票表决，怎么样？通过这种方式，被接受的答案将获得15个声誉，而投票站将获得10个声誉。对我来说似乎很公平。
.photos-btn {
    background-color: #B21589;
    cursor: pointer;
    color: white;
    font-size: 9px;
    font-weight: bold;
    padding: 4px;
    margin-top: 2px;
    vertical-align: top;
}