Monday 15 September 2014

html - Clear gap between span and table -



html - Clear gap between span and table -

jsfiddle

i added span right after first table, didn't work expected, there gap between table , span, , span width not conform first table's width

this css span:

.tieudecuoi { line-height:24px; background-color: #80a5ce; text-transform: uppercase; color: #fff; font-weight: bold; font-size: 12px; margin-top: 0; margin-bottom: 0; padding-top:0px; padding-bottom: 0; width:300px !important; }

jsfiddle

it works me, mentioned in comments, tested in chrome...

edit: changed aproach little bit, not sure if can in project, if do, give want result. please allow me know if doable you.

class="snippet-code-css lang-css prettyprint-override"> .tieudecuoi { background-color: #80a5ce; text-transform: uppercase; color: #fff; font-weight: bold; font-size: 12px; margin-top: 0; margin-bottom: 0; padding-top: 0px; padding-bottom: 0; } body { } table, th, td, tr { border-collapse: collapse; border: 1px solid; } .tb { width: 500px; } /*2 cell đầu tiên, xác định độ rộng*/ .tdkq { width: 70%; vertical-align: top; } .tddd { width: 30%; vertical-align: top; } /*bảng kết quả và đầu đuôi*/ .tbkq { width: 100%; word-wrap: break-word; table-layout: fixed; float: left; margin-bottom: 0; padding-bottom: 0; } .tbdd { width: 100%; } /*cột giải và kết quả của bảng kết quả*/ .trkq { width: 100%; } .thkqgiai { width: 20% !important; } .thkqso { width: 80% !important; } .tdkqgiai { text-align: center; } .tdkqso { text-align: center; word-wrap: break-word !important; } /*cột đầu và đuôi của bảng đầu đuôi*/ .thdddau { width: 30%; } .thddduoi { width: 70%; } /*tiêu đề cho bảng kq*/ .tieudemien { line-height: 24px; background-color: #80a5ce; text-transform: uppercase; color: #fff; font-weight: bold; font-size: 12px; width: 500px; margin-bottom: 0; padding-bottom: 0; } class="snippet-code-html lang-html prettyprint-override"><h2 class="tieudemien"> kết quả xổ số miền bắc ngày 02-11-2014</h2> <table class="tb"> <tbody> <tr> <td class="tdkq"> <table class="tbkq"> <tbody> <tr class="trkq"> <th class="thkqgiai">giải</th> <th class="thkqso">btb</th> </tr> <tr> <td class="tdkqgiai">Đặc biệt</td> <td class="tdkqso">23411</td> </tr> <tr> <td class="tdkqgiai">giải nhất</td> <td class="tdkqso">37428</td> </tr> <tr> <td class="tdkqgiai">giải nh&#236;</td> <td class="tdkqso">38460-75356</td> </tr> <tr> <td class="tdkqgiai">giải ba</td> <td class="tdkqso">02055-66542-36814-52154-66881-20546</td> </tr> <tr> <td class="tdkqgiai">giải bốn</td> <td class="tdkqso">6300-7736-6062-3408</td> </tr> <tr> <td class="tdkqgiai">giải năm</td> <td class="tdkqso">0235-2078-1344-6340-4550-6337</td> </tr> <tr> <td class="tdkqgiai">giải s&#225;u</td> <td class="tdkqso">046-421-944</td> </tr> <tr> <td class="tdkqgiai">giải bảy</td> <td class="tdkqso">88-98-24-21</td> </tr> <tr> <td colspan="2" class="tieudecuoi"> spadfj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkj lkjn </td> </tr> </tbody> </table> </td> <td class="tddd"> <table class="tbdd"> <tbody> <tr class="trkq"> <th class="thdddau">Đầu</th> <th class="thddduoi">Đuôi</th> </tr> <tr> <td class="tdkqgiai">0</td> <td class="tdkqso">0,8</td> </tr> <tr> <td class="tdkqgiai">1</td> <td class="tdkqso">1,4</td> </tr> <tr> <td class="tdkqgiai">2</td> <td class="tdkqso">8,1,4,1</td> </tr> <tr> <td class="tdkqgiai">3</td> <td class="tdkqso">6,5,7</td> </tr> <tr> <td class="tdkqgiai">4</td> <td class="tdkqso">2,6,4,0,6,4</td> </tr> <tr> <td class="tdkqgiai">5</td> <td class="tdkqso">6,5,4,0</td> </tr> <tr> <td class="tdkqgiai">6</td> <td class="tdkqso">0,2</td> </tr> <tr> <td class="tdkqgiai">7</td> <td class="tdkqso">8</td> </tr> <tr> <td class="tdkqgiai">8</td> <td class="tdkqso">1,8</td> </tr> <tr> <td class="tdkqgiai">9</td> <td class="tdkqso">8</td> </tr> </tbody> </table> </td> </tr> </tbody> </table>

html css

No comments:

Post a Comment