塊與商品「掉落」下單位類別

Question

這是我的問題： 如果我使用standart圖片和描述（如圖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

時實際圖像正在加載，

您的總寬度r目錄增加了超過948px，因此它必須移動到下一行。

在

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

，而不是width

您錯誤地指定weight