我的评论用完了评论框

时间:2013-04-01 06:18:39

标签: php html css

在我的网站上,我允许用户发布带有姓名和图片的评论。我注意到一个问题,当一些人使用HTML代码在评论中发布更大的图片时,它会用完评论框。所以我想要的东西应该留在评论框内。不管他们发布多大的图片。我已经发布了以下所有细节,请帮助谢谢:|

enter image description here

我的HTML

<div class="mycomment">
        <div id="postpic">
            <img id="profile_pic" width="50px" height="150px" src="image/user/1.gif" class="">
        </div>
        <div class="mycommentpost">                     
            <a class="postername" href="profile.php?userID=1">Deepak Kumar: </a><br>
            <img src="http://i00.i.aliimg.com/wsphoto/v0/789295022/-font-b-Easter-b-font-day-font-b-Bunny-b-font-ears.jpg" width="650" height="350" alt="">
        </div>
</div>

我的css:

.mycomment {
font-weight: normal;
color: #000000;
border: 2px solid #DEDEDE;
letter-spacing: 1pt;
font-family: arial, helvetica, sans-serif;
float: left;
width: 550px;
margin: 20px 0;
}

#postpic {
float: left;
width: 70px;
}

.mycommentpost {
font-weight: normal;
color: #000000;
letter-spacing: 1pt;
width: 480px;
float: right;
}

.postername {
color: #580000;
font-weight: bold;
font-size: 1em;
text-decoration: none;
}

这里的评论只是一张图片:

<img src="http://i00.i.aliimg.com/wsphoto/v0/789295022/-font-b-Easter-b-font-day-font-b-Bunny-b-font-ears.jpg" width="650" height="350" alt="">

已解决:添加此 - &gt;

.mycommentpost > img{
    max-height: XXXpx !important;
    max-width: XXXpx !important;
}

3 个答案:

答案 0 :(得分:2)

添加到您的CSS

.mycommentpost > img{
    max-height: XXXpx !important;
    max-width: XXXpx !important;
}

这样您就可以限制添加图像的最大尺寸..

答案 1 :(得分:0)

试试这个

<div class="mycomment">
    <div id="postpic">
        <img id="profile_pic" width="50px" height="150px" src="image/user/1.gif" class="">
    </div>
    <div class="mycommentpost">                     
        <a class="postername" href="profile.php?userID=1">Deepak Kumar: </a><br>
        <img src="http://i00.i.aliimg.com/wsphoto/v0/789295022/-font-b-Easter-b-font-day-font-b-Bunny-b-font-ears.jpg" width="650" height="350" alt="">
    </div>

.mycommentpost {
font-weight: normal;
color: #000000;
letter-spacing: 1pt;
width: 480px;
float: left;
}
.mycommentpost img{
 width :450px;   
}

答案 2 :(得分:0)

无论他们使用此css上传的图片大小,都会将图片设置为mycommentpost div中的默认大小。

> .mycommentpost img{
>      border: 1px solid #DEDEDE;
>     padding: 10px;
>     width: 130px; }