tableに指定した背景を少し広げようと思って
paddingを指定したけどうんともすんとも言わない
firebugで確認してもpaddingは指定されてるわ、でも実際には反映されてないわってのが確認できた
最小のソースで試してみたらそっちはちゃんとpadding効いた
さっぱり意味がわからず時間も無かったから
その時は背景色と同じ色のborderで誤魔化した（邪道）けど
落ち着いてよく考えてみたら
問題の起きてるファイルに読み込まれてて
最小の記述に読み込まれてないreset.css内の内容がほぼ犯人としか思えない
そこでtable周りのreset指定を見なおして、とてつもなく怪しい奴がいました
1 | table{border-collapse:collapse;} |
って事で次のように書き換えてみると
1 | table{border-collapse:separate;} |
tableに指定したpaddingが反映されました
![[image]tableにmargin](https://i2.wp.com/blog.sakurachiro.com/wp-content/uploads/2013/04/2013-04-25_01.png)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <style> body{ padding:3em; font-family:sans-serif; } table{ width:300px; margin:0auto; background:#f33; padding:2em; border:1pxsolid#000; border-collapse:collapse; margin-bottom:20px; } th,td{ background:#fff; border:1pxsolid#000;padding:.5em; } .separate{ border-collapse:separate; } </style> </head> <body> <table> <tr> <td>th th</td> <td>td td</td> </tr> <tr> <td>th th</td> <td>td td</td> </tr> </table> <table class="separate"> <tr> <td>th th</td> <td>td td</td> </tr> <tr> <td>th th</td> <td>td td</td> </tr> </table> </body> </html> |
staat er vol van)Op nummer 2 slapende mensen (sinds kort mee bezig en super grappig om te doen, vooral de onschuld vind ik super interessant aan zo'n foto)Op nummer 3 mijn kleine neefjes en nichtjes ( heb er ondertussen al aardig wat en wat mij betreft kunnen die in een H&M campagne!)Deze 3 dingen fotografeer ik het meest met mijn mobiel en zegt het volgende over mijn style: geek/nerd/laidbackSucces met het kiezen van en superleuk dat je dit wilt delen met jouw lebgmessen!kimberlyvandenzere83@grail.com