All geek questions in one place

Work Around Firefox Border Rendering Bug

I use a table to display a calendar. I noticed an odd rendering error in rendering table cells in Firefox version 3.6-7. Here the screen capture is performed:

table border rendering bug

As you can see, when scrolling, the border becomes “bent”. In addition, there are gaps between the horizontal and vertical borders where they are not “bent”. A live example can be seen on this website .

I do not see this behavior in Chrome, Safari or Internet Explorer.

UPDATE

I still see this problem in Firefox 20. I noticed that individual pixel borders do not show this behavior, only two pixels or more.

+4
source share
1 answer

You have a crash problem:

Here is the solution for your problem: http://www.charlesgarwood.com/blog/?p=13

What to do:

  • change border-collapse from collapse to separate
  • change border-width <td> and <th> from 2px to 1px
  • give yourself <table> a 1px border

Give some conditional comments as described in the link

+5
source

Source: https://habr.com/ru/post/1380211/

More articles:


All Articles