IE9 trong chế độ tương thích không hiển thị phong cách CSS đúng

Tôi có một div lồng nhau (xem dưới đây) mà có các lớp học CSS khác nhau để đưa ra một màu nền cho container và định dạng cho văn bảnIE9 trong chế độ tương thích không hiển thị phong cách CSS đúng

<div class="section"> 
    <div class="sectionTitle"> 
     <dx:ASPxLabel ID="lblSectionTitle" runat="server" Text='<%# Eval("SectionTitle") %>'></dx:ASPxLabel> 
    </div> 

    <div class="sectionTitle"> 
     <dx:ASPxLabel ID="lblSectionDesc" runat="server" Text='<%# Eval("SectionDescription") %>'></dx:ASPxLabel> 
    </div>

Có một đóng thẻ cho phần div, có nhiều nội dung trong đó hiển thị chính xác hơn.

Các CSS cho ở trên là:

.section 
{ 
    padding: 5px; 
    background-color: #ffffff; 
} 

.sectionTitle 
{ 
    font-size: 11px; 
    font-family: Arial; 
    font-weight: bold; 
    color: #546fb2; 
}

Khi tôi nhận xét ra màu nền trong .section định dạng của sectionTitle đang được áp dụng nhưng khi tôi đặt background-color trong đó nó ghi đè màu sắc của phầnTitle. Tôi đã thử thiết lập màu sắc của .section để phù hợp với .sectionTitle nhưng điều này vẫn không hoạt động.

Trong mọi trình duyệt (IE9 không tương thích, Firefox, Chrome) nó hoạt động tốt và tôi đã xem xét điều này trong một vài giờ bây giờ mà là hơi bực bội vì tôi không thể phát hiện vấn đề.

Nội dung trên một trang ASP.NET trong đó sử dụng một MasterPage trong đó có các loại tài liệu:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

bất cứ ai có thể giúp làm sáng tỏ về vấn đề này xin vui lòng?

Cảm ơn trước

Andy

Nguồn

2012-03-09 anD666

bạn đã kiểm tra cả hai lớp với cùng một thuộc tính? – krish

Internet Explorer có tính năng "tương thích", nơi tính năng này luôn hiển thị các trang web trên mạng cục bộ ở chế độ tương thích. Bạn phải tắt điều này một cách rõ ràng theo một trong hai cách.

<meta http-equiv="x-ua-compatible" content="ie=edge" />

Dấu cạnh này cho biết luôn luôn hiển thị ở chế độ chuẩn nhất mà nó hỗ trợ. Các phương pháp khác (mà tôi thích) được sử dụng nếu bạn đang sử dụng một công nghệ phía máy chủ như asp.net hoặc php, đó là để thêm một tiêu đề http (trong asp.net này đi trong global.asax, cũng là chrome = 1 cho phép chromeframe nếu được cài đặt):

protected void Application_BeginRequest() 
{ 
    Response.Headers.Add("X-UA-Compatible", "IE=edge, Chrome=1"); 
}

EDIT:

Ngoài ra còn có một cách thứ ba, và đó là để vô hiệu hóa nó trong tab xem tương thích trong Internet Options. Tuy nhiên, điều này chỉ ảnh hưởng đến máy tính của bạn.

Ngoài ra, tốt hơn nên sử dụng phương thức tiêu đề nếu có thể, thay vì phương pháp thẻ meta. Vào thời điểm trình duyệt đã đọc thẻ meta, nó đã ở trong chế độ chính của nó. Thẻ meta chỉ ảnh hưởng đến chế độ hiển thị tài liệu, thay vì chế độ tương thích với trình duyệt. Có một sự khác biệt tinh tế có thể, trong một số trường hợp, có ảnh hưởng.

Nguồn

2012-03-10 15:26:07

Cảm ơn bạn! Đã lưu tôi với kiến thức của bạn. – Landmine

Điều gì sẽ xảy ra nếu một khách hàng thực sự đang sử dụng một trình duyệt cũ? Tiêu đề làm gì trong trường hợp đó? – James

@ James - không có gì, vì trình duyệt sẽ không nhận ra nó ... nó chỉ bỏ qua nó. –

thử thêm video này vào tiêu đề

<meta http-equiv="x-ua-compatible" content="ie=emulateie9" />

Nhấn F12 trên IE9 và nếu có chế độ tài liệu Qirks, bạn phải sửa chữa nó bằng thẻ meta. Có lẽ đây là vấn đề của bạn.

Nguồn

2012-03-10 12:58:30 M1K1O

Trên thực tế, một thẻ tốt hơn để sử dụng là 'ie = edge', điều này sẽ đảm bảo rằng khi IE10 xuất hiện hoặc 11, nó luôn hiển thị ở chế độ tiêu chuẩn nhất. –

tôi nghĩ rằng điểm câu hỏi để khắc phục sự cố trong chế độ xem tương thích IE-9 không bỏ qua chế độ xem tương thích – krish

IE9 trong chế độ tương thích không hiển thị phong cách CSS đúng

Trả lời

Các vấn đề liên quan