1
저는 RequiredFieldValidator에서 ValidatorCalloutExtender를 사용하고 있으며 기본 스타일을 '현대 UI'로 변경하기로 결정했습니다. Wonderful Post을 찾았습니다. 관련 CSS 필드를 모두 얻을 수있었습니다. 나는 스타일을 바꾸기 시작했고 그 결과에 매우 만족했습니다. IE, Chrome, FireFox에서 테스트를 해봤는데 완벽하게 작동했습니다. 그런 다음 프로덕션 서버에 설치하고 어떤 브라우저를 사용하던간에 CSS가 올바르게 렌더링되지 않는다는 사실을 알았습니다. 내가 아래에있는 내 CSS를 포함했다ValidatorCalloutExtender가 CSS를 제대로 렌더링하지 않습니다.
http://s14.postimg.org/gn5kjgovl/Rendered_Differently.png 예 이미지 (그냥 넣다 뭔가 잘못 했어).
/* AjaxControlToolkit Validator */
.validatorCalloutHighlight
{
\t border:solid;
\t border-color: #FFCC00;
/*background-color: lemonchiffon;*/
}
.ajax__validatorcallout_popup_table
{
\t /*position:absolute;*/
\t min-width: 350px;
\t min-height: 40px;
\t /*padding: 8px;*/
\t background: #FFCC00;
\t -webkit-border-radius: 0px;
\t -moz-border-radius: 0px;
\t border-radius: 0px;
\t margin-left:250px;
\t margin-top:-20px;
\t color:black;
}
.ajax__validatorcallout_popup_table:after
{
\t content: '';
\t position:absolute;
\t border-style: solid;
\t border-width: 20px 20px 0 0;
\t border-color: #FFCC00 transparent transparent transparent;
\t display: block;
\t width: 0;
\t bottom: -20px;
\t left: 0px;
}
/* The popup table row */
.ajax__validatorcallout_popup_table_row
{
}
/* The callout cell */
.ajax__validatorcallout_callout_cell
{
}
/* The table in the callout cell */
.ajax__validatorcallout_callout_table
{
}
/* The callout table row */
.ajax__validatorcallout_callout_table_row
{
}
/* The error message cell */
.ajax__validatorcallout_error_message_cell
{
}
/* The warning icon cell */
.validator_callout .ajax__validatorcallout_icon_cell
{
\t padding:0px;
}
.validator_callout .ajax__validatorcallout_icon_cell img
{
\t /* Remove the 'Warning' icon */
\t display: none;
}
/* The close button cell */
.ajax__validatorcallout_close_button_cell
{
}
/* The arrow cell */
.ajax__validatorcallout_arrow_cell
{
\t display:none;
}
/* Inner div of a cell. Used in the close button */
.ajax__validatorcallout_innerdiv
{
}ASP 코드는 내가 심지어 한 사용자 정의 헤더와의 Web.config 변경으로까지 갔다
<asp:TextBox ID="txtUsername" runat="server" Width="300px"></asp:TextBox>
<asp:RequiredFieldValidator CssClass="validator_callout" ID="reqvalUsername" runat="server" ControlToValidate="txtUsername" Display="None" ErrorMessage="Enter a new login name" ValidationGroup="Submit">*</asp:RequiredFieldValidator>
<cc1:ValidatorCalloutExtender ID="reqvalUsername_ValidatorCalloutExtender" runat="server" CloseImageUrl="~/Images/Buttons/cancel_Validator.png" HighlightCssClass="validatorCalloutHighlight" TargetControlID="reqvalUsername" PopupPosition="TopRight" WarningIconImageUrl="~/Images/Status/clear.png">
</cc1:ValidatorCalloutExtender>이하 내 문제를 해결하지 마라. CSS renders differently on web server than on development environment
저는 새로운 스타일을 사용하고 싶습니다. 간과 한 것 같지만, 이것을 해결하는 방법에 대한 아이디어가 없습니다. 아무도이 좌절스러운 문제를 도와 줄 수 있습니까?