0

入力の隣にあると思われる画像があります。コードは次のとおりです。

<style type="text/css">
#post_comments{
    margin-top:1px;
    max-width: 568px;
    border: 1px solid #eee;
}
.comments{
    text-align: center;
    background: #eee;
    color:#555;
    max-width: 568px;
    height: 40px;
    margin-left: auto;
    margin-right: auto;
}
.comments:hover{
    color: #333;
}
.make_comment{
    margin-top: 0px;
    margin-bottom: 2px;  
    width: 400px;
    height: 25px;
}
</style>
<div id="post_comments">
    <div class="comments">
        <img src="/elitequorum/images/image.jpg" style="margin-top: 2px;" width="35" height="35">
        <input placeholder="Make a comment...." type="text" class="make_comment">
    </div>
</div>

画像が入力よりも高くならないように、画像と入力を揃えるのを手伝ってもらえますか? ありがとう。

4

2 に答える 2

0

画像は自動的に上部に配置されます。これを入力 css に追加してみてください。

vertical-align:top;
于 2013-02-21T05:20:43.890 に答える
0

CSS の使用時:

<style type="text/css">
#post_comments{
    margin-top:1px;
    max-width: 568px;
    border: 1px solid #eee;
}
.comments{
    text-align: center;
    background: #eee;
    color:#555;
    max-width: 568px;
    height: 40px;
    margin-left: auto;
    margin-right: auto;
    vertical-align:top;
    margin-top: 10px;
}
.comments:hover{
    color: #333;
}
.make_comment{
    margin-top: 5px;
    margin-bottom: 2px;  
    width: 400px;
    height: 25px;
}
</style>

HTML での使用:

<div id="post_comments">
    <div class="comments">
        <img src="/elitequorum/images/image.jpg" style="margin-top: 2px;vertical-align:top;" width="35" height="35">
        <input placeholder="Make a comment...." type="text" class="make_comment" >
    </div>
</div>

お役に立てば幸いです...

于 2013-02-21T05:26:29.603 に答える