luckyshot/ipad-html5-css3-template

solution for the table corners problem

Opened this issue · 0 comments

Author : Charlie K
E-mail : charlie@g...com

Thanks for the great template!
This may be a solution for the table corners problem. Move the white background color from tbody to the individual table cells (tbody tr td), then replace the existing "Dirty fix..." with the following:

#main table {
        border-collapse: separate;
}
#main table tbody tr td{
        border-top:1px solid #B4B7BB;
}
#main table tbody tr:last-child td{
        border-bottom:1px solid #B4B7BB;
}
#main table tbody tr td:last-child{
        border-right:1px solid #B4B7BB;
}
#main table tbody tr td:first-child{
        border-left:1px solid #B4B7BB;
}
#main table tbody tr:first-child td:first-child {
        border-top-left-radius:10px;
}
#main table tbody tr:first-child td:last-child {
        border-top-right-radius:10px;
}
#main table tbody tr:last-child td:first-child {
        border-bottom-left-radius:10px;
}
#main table tbody tr:last-child td:last-child {
        border-bottom-right-radius:10px;
}

Tested in latest Firefox, Chrome, Safari(Mac). Hope it helps.