html - table padding has no effect css -
#table_1 { border-collapse: collapse; height: 217px; width: 287px; perspective-origin: 143.5px 108.5px; transform-origin: 143.5px 108.5px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#table_1*/ #tbody_2 { border-collapse: collapse; height: 217px; width: 287px; perspective-origin: 143.5px 108.5px; transform-origin: 143.5px 108.5px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tbody_2*/ #tr_3, #tr_7, #tr_11 { border-collapse: collapse; height: 54px; vertical-align: middle; width: 287px; perspective-origin: 143.5px 27px; transform-origin: 143.5px 27px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tr_3, #tr_7, #tr_11*/ #td_4, #td_8, #td_12 { border-collapse: collapse; height: 52px; vertical-align: middle; width: 70px; perspective-origin: 36px 27px; transform-origin: 36px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 0px; }/*#td_4, #td_8, #td_12*/ #td_5, #td_9, #td_13 { border-collapse: collapse; height: 24px; vertical-align: middle; width: 54px; perspective-origin: 35px 27px; transform-origin: 35px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_5, #td_9, #td_13*/ #td_6, #td_10 { border-collapse: collapse; height: 24px; vertical-align: middle; width: 129px; perspective-origin: 72.5px 27px; transform-origin: 72.5px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_6, #td_10*/ #td_14 { border-collapse: collapse; height: 24px; vertical-align: middle; width: 129px; perspective-origin: 72.5px 27px; transform-origin: 72.5px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_14*/ #tr_15 { border-collapse: collapse; height: 55px; vertical-align: middle; width: 287px; perspective-origin: 143.5px 27.5px; transform-origin: 143.5px 27.5px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tr_15*/ #td_16 { border-collapse: collapse; height: 52px; vertical-align: middle; width: 70px; perspective-origin: 36px 27.5px; transform-origin: 36px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 1px; }/*#td_16*/ #td_17 { border-collapse: collapse; height: 24px; vertical-align: middle; width: 54px; perspective-origin: 35px 27.5px; transform-origin: 35px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_17*/ #td_18 { border-collapse: collapse; height: 24px; vertical-align: middle; width: 129px; perspective-origin: 72.5px 27.5px; transform-origin: 72.5px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_18*/<table id="table_1"> <tbody id="tbody_2"> <tr id="tr_3"> <td id="td_4"> adult </td> <td id="td_5"> 1 </td> <td id="td_6"> 10.00 myr </td> </tr> <tr id="tr_7"> <td id="td_8"> child </td> <td id="td_9"> 1 </td> <td id="td_10"> 5.00 myr </td> </tr> <tr id="tr_11"> <td id="td_12"> promo </td> <td id="td_13"> abc </td> <td id="td_14"> -5.00 myr </td> </tr> <tr id="tr_15"> <td id="td_16"> </td> <td id="td_17"> total </td> <td id="td_18"> -12.00 myr </td> </tr> </tbody> </table>the table above have of padding, want reduce height of table reducing padding, seems no effect when apply it. why? thought applied border-coolapse:collapse table , work padding td?
you need remove height , manage padding according need , have no need add border-collapse: collapse; in td add in table.
if add padding or height in first td apply td of parent tr.
table{border-collapse: collapse;} table td{padding:3px 4px} /* example*/ #table_1 { /*height: 217px;*/ width: 287px; perspective-origin: 143.5px 108.5px; transform-origin: 143.5px 108.5px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#table_1*/ #tbody_2 { /*height: 217px;*/ width: 287px; perspective-origin: 143.5px 108.5px; transform-origin: 143.5px 108.5px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tbody_2*/ #tr_3, #tr_7, #tr_11 { /*height: 54px;*/ vertical-align: middle; width: 287px; perspective-origin: 143.5px 27px; transform-origin: 143.5px 27px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tr_3, #tr_7, #tr_11*/ #td_4, #td_8, #td_12 { /*height: 52px;*/ vertical-align: middle; width: 70px; perspective-origin: 36px 27px; transform-origin: 36px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 0px; }/*#td_4, #td_8, #td_12*/ #td_5, #td_9, #td_13 { /*height: 24px;*/ vertical-align: middle; width: 54px; perspective-origin: 35px 27px; transform-origin: 35px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; /*padding: 15px 15px 15px 1px;*/ }/*#td_5, #td_9, #td_13*/ #td_6, #td_10 { /*height: 24px;*/ vertical-align: middle; width: 129px; perspective-origin: 72.5px 27px; transform-origin: 72.5px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; /*padding: 15px 15px 15px 1px;*/ }/*#td_6, #td_10*/ #td_14 { /*height: 24px;*/ vertical-align: middle; width: 129px; perspective-origin: 72.5px 27px; transform-origin: 72.5px 27px; border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; /*padding: 15px 15px 15px 1px;*/ }/*#td_14*/ #tr_15 { /*height: 55px;*/ vertical-align: middle; width: 287px; perspective-origin: 143.5px 27.5px; transform-origin: 143.5px 27.5px; border: 0px none rgb(128, 128, 128); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; }/*#tr_15*/ #td_16 { /*height: 52px;*/ vertical-align: middle; width: 70px; perspective-origin: 36px 27.5px; transform-origin: 36px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 1px; }/*#td_16*/ #td_17 { /*height: 24px;*/ vertical-align: middle; width: 54px; perspective-origin: 35px 27.5px; transform-origin: 35px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_17*/ #td_18 { /*height: 24px;*/ vertical-align: middle; width: 129px; perspective-origin: 72.5px 27.5px; transform-origin: 72.5px 27.5px; border-top: 1px solid rgb(51, 51, 51); border-spacing: 2px 2px; font: normal normal 300 normal 18px / normal nunito, serif; padding: 15px 15px 15px 1px; }/*#td_18*/<table id="table_1"> <tbody id="tbody_2"> <tr id="tr_3"> <td id="td_4"> adult </td> <td id="td_5"> 1 </td> <td id="td_6"> 10.00 myr </td> </tr> <tr id="tr_7"> <td id="td_8"> child </td> <td id="td_9"> 1 </td> <td id="td_10"> 5.00 myr </td> </tr> <tr id="tr_11"> <td id="td_12"> promo </td> <td id="td_13"> abc </td> <td id="td_14"> -5.00 myr </td> </tr> <tr id="tr_15"> <td id="td_16"> </td> <td id="td_17"> total </td> <td id="td_18"> -12.00 myr </td> </tr> </tbody> </table>hope i'll helps you.
Comments
Post a Comment