Firefox 17 và CSS viền tam giác dựa trên không hiển thị đúng

Question

Giống như nhiều nhà phát triển front-end, tôi đã sử dụng thủ thuật biên giới để hiển thị tam giác trong CSS. http://apps.eky.hk/css-triangle-generator/ máy phát điện này giúp với kỹ thuật này.

Hôm nay, nhóm Firefox đã phát hành một phiên bản mới mà không có bất kỳ thay đổi rõ ràng nào trên công cụ hiển thị.

Bây giờ chúng ta có thể thấy một đường viền màu xám không đúng màu sắc xung quanh những hình tam giác đó. Tôi chưa tìm được mẹo để loại bỏ nó. chỉnh sửa: nó dễ dàng hơn để xem nếu bạn buộc nền "giống như trong suốt" cho một cái gì đó như "xanh"

Trên hết, trước khi Firefox 17, khi mọi người phàn nàn về cách đặt bí danh những hình tam giác đó, lừa là đặt thuộc tính kiểu đường viền thành "dấu gạch ngang" thay vì cứng.

Sử dụng firebug trên trình tạo tam giác, bạn có thể nhanh chóng xem cách nó hiển thị ngay bây giờ.

Có ai biết khắc phục sự cố này không?

chỉnh sửa: sử dụng border-style: inset như đề nghị ám một màu sáng hơn trên tôi FF17

Answer 1

Ok đây là giải pháp tốt nhất mà tôi có cho đến nay:

nhận được giá trị rgb của tam giác của bạn, và sử dụng này là một opacity rgba 0 thay vì "trong suốt" cho các đường viền đối lập của tam giác của bạn.

Giữ cú pháp cũ "trong suốt" dựa trên sẽ làm việc như một dự phòng cho IE8

rằng kết thúc với một cái gì đó như thế này:

border-color: transparent transparent transparent #ffffff; 
border-color: rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0) #ffffff; 

như đã nói trong bài trả lời: thiết lập border-style để "inset" như đề xuất làm thay đổi màu trên FF17.

Tôi hy vọng ai đó sẽ tìm thấy giải pháp đơn giản hơn hoặc bài đăng này sẽ giúp người khác.

Answer 2

Sự kết hợp này của sửa chữa Adeher và sửa chữa biên giới rải rác khác dường như giải quyết vấn đề một cách hoàn hảo trong FF23.

Ở dạng dài:

border-top: 10px solid #FF0000; 
border-left: 30px dotted rgba(255, 0, 0, 0); 
border-right: 30px dotted rgba(255, 0, 0, 0); 

Kết hợp rgba Adeher của() sửa chữa với những sửa chữa biên giới rải rác (nhưng chỉ trên biên giới trong suốt) dường như làm cho một tam giác hoàn hảo mà không biên giới mờ xấu xí.