阻止货物＆＃34;掉线＆＃34;在单位类别下

Question

这是我的问题： 如果我使用标准图片和描述（如图1） - 我有良好的网站外观。但是当我使用数据库中的数据时，块目录向左移动（图2）。 两种情况下的代码都相同，但外观非常不同

#wrapper {
 margin-top:40px;
 width: 1200px;
 margin: 0 auto;
 height: auto !important;
 }
#category
 {
 padding:10px 10px 10px 20px;
 border-left: 1px solid #d9d9d9;
 border-right: 1px solid #d9d9d9;
 border-bottom: 1px solid #d9d9d9;
 width:200px;
 clear:both;
 display:block;
 }

 #category ul li{
 word-wrap: break-word;
 list-style-image: url(/neoshop/images/check.png);
 padding:10px 0px 10px 10px;
border-bottom:1px dotted #cccccc;
 }
 #category ul li:last-child{
border-bottom:0px dotted #cccccc;
 }

#category ul li a{
font:15px/1.3 "Arial", Arial,Helvetica, sans-serif;
 margin-top:0px;
 font-weight:100;
 display:block;
 color:#2f3638;
 text-decoration:none;
 line-height:20px;

 }

#category ul li a:hover{

 color:#0bb1e8;
 }

#category ul ul a{

list-style-image:none;
color:#8b8b8b;
background:#fff;
}

#category ul ul{
margin-top:5px;
display:none;
color:#8b8b8b;
background:#fff;
}

#category ul ul li{
 word-wrap: break-word;
 list-style-image: none;
 padding:10px 0px 10px 10px;
border-bottom:1px dotted #cccccc;
 }

.catalog
{
margin-left:12px;
float:left;
 width:948px;

}

.product-main
{
    width:236px;
    height:285px;
    float:left;
}

.product{
border-right:1px dotted #cccccc;
padding:0 15px;
}
    .product h2{
    color:#111017;
    text-align:center;
    font:bold 14px/1.3 Tahoma;
    margin:0 0 15px 0;
    }
    .product h3{
    color:#111017;

    text-align:center;
    font:bold 12px/1.3 Tahoma;
    margin:0 0 15px 0;
    }
    .product-img{

    text-align:center;  
    }

    .product-img img{   
    weight:114px;
    height:112px;   
    }

    .price{
    font:13px/1.3 "Arial", Arial,Helvetica, sans-serif;
    color:#0bb1e8;


    }

        .price span{
        font:13px/1.3 "Arial", Arial,Helvetica, sans-serif;
        color:#111017;
        text-align:center;

        }

        .price a{
        clear:both;
        float:right;    
        }
    .bot-dot
    {
    border-bottom:1px dotted #cccccc;
    margin:20px;
    }

.product-main:nth-child(4n) .product
{
border-right:none;
}
.product-main:last-child .product
{
border-right:none;
}
.product-main:nth-child(4n) .bot-dot
{
margin: 20px 0 20px 20px;
}
.product-main:nth-child(4n+1) .bot-dot
{
margin: 20px 20px 20px 0px;
}

必须是这样的：

但我有这个：

Answer 1

当加载实际图像时，

目录的总宽度增加超过948像素，因此必须移至下一行。

in

.product-img img{   
    weight:114px;
    height:112px;   
    }

而不是width您错误地指定了weight