如何禁用由ASP.NET AJAX ValidatorCalloutExtender創建的表上的填充？

我正在ASP.Net C＃中使用AjaxControlToolkit ValidatorCalloutExtender控件對我的字段驗證器進行控制。擴展器的彈出窗口被呈現：如何禁用由ASP.NET AJAX ValidatorCalloutExtender創建的表上的填充？

Broken popup

（注意介乎錯誤消息框的空間和箭頭標註）。我知道這是爲什麼發生;我有一個包含一個表，我確認（validate）中規定的管制形式，而我在我的CSS的形式表如下：

.formTable td, .formTable th 
{ 
    padding: 3px; 
}

如果我註釋掉padding: 3px;的彈出窗口看起來不錯..但是我的表單佈局看起來很糟糕。

所以我的問題是這樣的：有沒有辦法我可以在我的表格佈局表上留下填充，但禁用它在表格內呈現的彈出窗口？

編輯：這是完整的CSS，我一直在玩覆蓋驗證器標註的樣式。

.ajax__validatorcallout_popup_table 
{ 
    /* display: none; */ 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_popup_table_row 
{ 
    vertical-align: top; 
    height: 100%; 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_callout_cell 
{ 
    width: 20px; 
    height: 100%; 
    text-align: right; 
    vertical-align: top; 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_callout_table 
{ 
    height: 100%; 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_callout_table_row 
{ 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_arrow_cell 
{ 
    padding: 8px 0 0 0; 
    text-align: right; 
    vertical-align: top; 
    font-size: 1px; 
    border: none; 
    background-color: transparent; 
} 

.ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv 
{ 
    font-size: 1px; 
    position: relative; 
    left: 1px; 
    border-bottom: none; 
    border-right: none; 
    border-left: none; 
    width: 15px; 
    background-color: transparent; 
    padding: 0px; 
} 

.ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv div 
{ 
    height: 1px; 
    overflow: hidden; 
    border-top: none; 
    border-bottom: none; 
    border-right: none; 
    padding: 0px; 
    margin-left: auto; 
} 

.ajax__validatorcallout_error_message_cell 
{ 
    font-family: Verdana; 
    font-size: 10px; 
    color: red; 
    padding: 5px; 
    border-right: none; 
    border-left: none; 
    width: 100%; 
} 

.ajax__validatorcallout_icon_cell 
{ 
    width: 20px; 
    padding: 5px; 
    border-right: none; 
} 

.ajax__validatorcallout_close_button_cell 
{ 
    vertical-align: top; 
    padding: 0px; 
    text-align: right; 
    border-left: none; 
} 

.ajax__validatorcallout_close_button_cell .ajax__validatorcallout_innerdiv 
{ 
    border: none; 
    text-align: center; 
    width: 10px; 
    padding: 2px; 
    cursor: pointer; 
}

編輯：這裏是ASP.Net呈現的HTML的彈出表（抱歉，我必須張貼它作爲一個圖像）。

Code for validator callout popup table

來源

2013-05-15 timbck2

標註擴展程序中是否存在class/id？ – vcsjones

只需加上'position：relative; left：3px;'對於小角落來說，很難說沒有看到更多信息 – iConnor

彈出窗口呈現時 - 它是否在呈現的HTML中有ID？ –

這樣的事情應該做的伎倆：

.popupclassname .formTable td, .popupclassname .formTable th { 
    padding: 0px; 
}

訣竅是使選擇比一般選擇更具體：更多關於特異性如何在這裏工作：http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

來源

2013-05-15 20:11:39 Timidfriendly

謝謝！這不是什麼固定它，但你指出我在正確的方向。我添加了'.formTable tr td .ajax__validatorcallout_popup_table tr td {padding：3px 0 3px 0; }'刪除箭頭和消息框之間的空格，然後我不得不在消息框中添加更多填充以使其看起來像我想要的那樣。 – timbck2

的快速的方法是改變你的填充：

padding: 0px

至

padding: 0px !important

來源

2013-05-15 20:44:37

使用！重要的通常被認爲是最後的解決方案，並儘可能避免。當你無法控制主樣式表，並且需要採取嚴厲的措施使你的規則更具體時，你才應該真正使用它。通常非常重要的是KLUDGE解決方案嚴重編碼CSS – Timidfriendly

如何禁用由ASP.NET AJAX ValidatorCalloutExtender創建的表上的填充？

回答

相關問題