CSS Rendering different firefox vs chrome & safari
-
Hi,
Thanks for a great plugin.
I have just recently applied some CSS to my tables at http://www.slotssons.com
Both at the top of the page and if you scroll, a little bit further down on the page.
The issue here seems to be related to rendering issues, firefox vs chrome and safari.
Everything looks amazing on chrome and safari, but quite bad on firefox. How can i fix that? Here is the custom CSS i uses for my tables :
.tablepress td {
background: #FAFAFA; /* for non-css3 browsers */
background-image: -moz-linear-gradient(top,#FAFAFA 50%,#E1E1E1 100%);
background-image: -webkit-linear-gradient(top,#FAFAFA 50%,#E1E1E1 100%);
-webkit-box-shadow: rgba(0,0,0,0.4) 0 1px 2px;
-moz-box-shadow: rgba(0,0,0,0.4) 0 1px 2px;
box-shadow: rgba(0,0,0,0.4) 0 1px 2px;
}.tablepress-id-2 tbody td {
font-size: 13px;
color: #ff0000;
}.tablepress-id-3 tbody td {
font-size: 10px;
color: #ff0000;
}@media (max-width: 979px) {
.tablepress-id-2 .column-2,
.tablepress-id-2 .column-3 {
display: none;
}}
.tablepress-id-2 .column-2,
.tablepress-id-2 .column-3,
.tablepress-id-2 .column-4 {
vertical-align: middle;
text-align: center;
}.tablepress-id-3 .column-1,
.tablepress-id-3 .column-2,
.tablepress-id-3 .column-3,
.tablepress-id-3 .column-4 {
vertical-align: middle;
text-align: center;
}.tablepress tbody tr:first-child td:first-child {
border-top-left-radius: 20px;
}.tablepress tbody tr:first-child th:last-child {
border-top-right-radius: 20px;
}.tablepress tbody tr:last-child td:first-child {
border-bottom-left-radius: 20px;
}.tablepress tbody tr:last-child td:last-child {
border-bottom-right-radius: 20px;
}.tablepress-id-2,
.tablepress-id-2 tr,
.tablepress-id-2 tbody td,
.tablepress-id-2 thead th,
.tablepress-id-2 tfoot th {
border: none;
}.tablepress-id-3,
.tablepress-id-3 tr,
.tablepress-id-3 tbody td,
.tablepress-id-3 thead th,
.tablepress-id-3 tfoot th {
border: none;
}.tablepress-id-3 .column-4 {
width: 100px;
}Support on this would be grateful.
Thanks in advance, and thanks for a great plugin.
The topic ‘CSS Rendering different firefox vs chrome & safari’ is closed to new replies.