2011-07-25 27 views
1

請看看http://jsfiddle.net/tMxmp/這個js小部件中的CSS有什麼問題?

爲什麼td的圖像過大了這麼多。

大小應該是100像素,但它是4000像素。

施加的CSS規則是

var style="<style type='text/css'>"; 



//div rules 
    style+="#w_23522{"; 
    style+="width:1000px;"; 
    //style+="margin: 2px auto;"; 
    //style+="overflow: hidden;"; 
    style+="}"; 

    //table rules 
    style+="#w_23522 .w_23522_table{"; 
    style+="width:1000px;"; 
    style+="background:#ffff60;"; 
    style+="border:5px solid #ff2020 !important;"; 
    style+="}"; 

    //td rules 
    style+="#w_23522 .w_23522_table td{"; 
    //style+="text-align: center;"; 
    style+="padding:0px !important;"; 
    style+="}"; 

    //article rules 
    style+="#w_23522 .w_23522_article{"; 
    //style+="text-align: center;"; 
    style+="margin: 0 auto;"; 
    style+="width: 100px;"; 
    style+="}"; 

    //text rules 
    style+="#w_23522 .w_23522_text{"; 
    style+="width:100px;"; 
    style+="text-align: center;"; 
    style+="font-family:Arial, Helvetica, sans-serif;"; 
    style+="font-size:13px !important;"; 
    style+="color:#0000cc;"; 
    style+="text-transform:normal;"; 
    style+="text-decoration:none;"; 
    style+="font-weight:normal !important;"; 
    style+="padding: 2px;"; 
    //style+="font-color:white;"; 
    style+="}"; 

    //link rules 
    style+="#w_23522 .w_23522_text a{"; 
    style+="text-align: center;"; 
    style+="font-family:Arial, Helvetica, sans-serif;"; 
    style+="font-size:13px !important;"; 
    style+="color:#0000cc;"; 
    style+="text-transform:normal;"; 
    style+="text-decoration:none;"; 
    style+="font-weight:normal !important;"; 
    style+="padding: 2px;"; 
    style+="}"; 

    //hover link rules 
    style+="#w_23522 .w_23522_text a:hover{"; 
    style+="font-family:Arial, Helvetica, sans-serif;"; 
    style+="font-size:13px !important;"; 
    style+="color:#0000cc;"; 
    style+="text-transform:normal;"; 
    //changed the decoration so the links get an underline 
    style+="text-decoration:underline;"; 
    style+="font-weight:normal !important;"; 
    style+="padding: 2px;"; 
    style+="text-align: center;"; 
    style+="}"; 

    //image rules 
    style+="#w_23522 img{"; 
    style+="text-align: center;"; 
    style+="width: 100px;"; 
    style+="height: 75px;"; 
    style+="border: 3px solid #2020d2;"; 
    style+="padding: 2020px !important;"; 
    style+="margin: 2px 0px 0px 0px;"; 
    style+="}"; 

    //disabled text rules 
    //style+="#w_23522 .w_23522_text{"; 
    //style+="width:100px;"; 
    //style+="text-align:center;"; 
    //style+="line-height:1.1 !important;"; 
    //style+="}"; 

    //spacing rules 
    style+=".w_23522_space{"; 
    style+="height:10px;"; 
    style+="}"; 
    style+=".w_23522_space2{"; 
    style+="height:2px;"; 
    style+="}"; 

    style+="</" + "style>"; 
+0

如果你能把js直接放在小提琴上,對那些試圖提供幫助的人會更好。 –

+0

它的一個動態小部件...你可以打開css使用鏈接http://domainsoutlook.net/wjs/12_23522/ – Anush

+0

對不起,它現在正在工作 –

回答

1

在你生成這段代碼這個外部文件:

#w_23522 .w_23522_table { 
    width:1000px; 
} 

它是指表類。

然後你產生這樣的:

#w_23522 img { 
    padding: 2020px !important; 
} 

你是怎麼想到不到一塌糊塗發生其他?

+0

剛剛看到.... ....兩次迴應代碼... – Anush