X
Nhấn vào đây để đến phiên bản di động của trang web.

Diễn đàn trợ giúp

foreignObject styling not working

  • Không có trả lời
  • 1 gặp vấn đề này
  • 1 lượt xem
Được đăng

I don't know if this is the only style that doesn't work.

I used this code from MDN to test it :

https://codepen.io/Supersudo/pen/MWYYeba

<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">

 <style>
   .test {
     color: white;
     font: 18px serif;
     height: 100px;
     overflow: auto;
   }
 </style>
 <polygon points="5,5 195,10 185,185 10,195" />
 <foreignObject x="20" y="20" width="160" height="160" style="border: 10px solid blue">
     Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 </foreignObject>

</svg>

Firefox doesn't display the blue border around the div while chromium does.

I don't know if this is the only style that doesn't work. I used this code from MDN to test it : https://codepen.io/Supersudo/pen/MWYYeba <svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"> <style> .test { color: white; font: 18px serif; height: 100px; overflow: auto; } </style> <polygon points="5,5 195,10 185,185 10,195" /> <foreignObject x="20" y="20" width="160" height="160" style="border: 10px solid blue"> <div xmlns="http://www.w3.org/1999/xhtml" class="test"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </div> </foreignObject> </svg> Firefox doesn't display the blue border around the div while chromium does.

Được chỉnh sửa bởi Mark Lough vào

Trích dẫn

Chi tiết hệ thống bổ sung

Ứng dụng

  • Chuỗi đại diện người dùng: Mozilla/5.0 (X11; Linux x86_64; rv:70.0) Gecko/20100101 Firefox/70.0

Thông tin chi tiết

Bạn phải đăng nhập vào tài khoản của bạn để trả lời bài viết. Vui lòng bắt đầu một câu hỏi mới, nếu bạn chưa có tài khoản.