html - How can I set border and padding to the table rows? -

-

i add divisions , padding between rows, i've noticed row borders displayed border-collapse: collapse, removes padding <tr> element. https://jsfiddle.net/c8ht9aso/

<table style="border: 1px solid red; border-collapse: collapse; padding: 20px">     <tr>         <td>header</td>     </tr>     <tr style="border-top:1px solid blue; vertical-align: top; padding: 20px">         <td>cell</td>     </tr>     <tr style="border-top:1px solid green; vertical-align: top; padding: 20px">         <td>another cell</td>     </tr> </table>

so remove border-collapse: collapse , can see padding, not horizontal lines between rows: https://jsfiddle.net/0mecu52u/

<table style="border: 1px solid red; padding: 20px">     <tr>         <td>header</td>     </tr>     <tr style="border-top:1px solid blue; vertical-align: top; padding: 20px">         <td>cell</td>     </tr>     <tr style="border-top:1px solid green; vertical-align: top; padding: 20px">         <td>another cell</td>     </tr> </table>

so how can add border , padding <tr>?

thanks.

if want set both border , padding in table layout, it's better set on td rather tr, make sure work across browsers correctly.

table {      border: 1px solid red;      border-collapse: collapse;  }  td {      vertical-align: top;      padding: 20px;  }  tr:nth-child(1) td {      border-bottom: 1px solid blue;  }  tr:nth-child(2) td {      border-bottom: 1px solid green;  }
<table>      <tr>          <td>header</td>      </tr>      <tr>          <td>cell</td>      </tr>      <tr>          <td>another cell</td>      </tr>  </table>


Comments

Post a Comment

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

-
i have problem namespace of spring security on xhtml page. don't understand why can't load uri, , have following issue: whitelabel error page application has no explicit mapping /error, seeing fallback. tue jul 21 16:58:12 utc 2015 there unexpected error (type=not found, status=404). please need help! possible uri has been changed? best regards you using incorrect namespace url. correct url http://www.springframework.org/schema/security the error page seeing spring source website since not recognize url. try visiting http://www.springsource.org/security/tags in browser update : spring security tags used in jsp page correct tag lib declaration is: <%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
Read more

asp.net core mvc - How important is the global.json and src folder? -

-
in vs 2015, when create new mvc 6.0 application using approach: file-->new-->project-->asp.net web application-->asp.net 5 preview templates you end have following file structure on disk: artifacts src myproject.sln global.json instead if decide create blank solution first so: file-->new-->project-->other project types-->visual studio solutions-->blank solution and start adding new asp.net web application project solution; end having file structure doesn’t have global.json file , no src folder. according documentation , the global.json file used configure solution whole. includes 2 sections, projects , sdk default. the projects property designates folders contain source code solution. default project structure places source files in src folder, allowing build artifacts placed in sibling folder, making easier exclude such things source control. the sdk property specifies version of dnx (.net execution environment) visual studio...
Read more

c++ - Using Gtest how return different values in ON_CALL? -

-
is possible return different values using on_call willbydefault? example class foomock { mock_method0(foo, int()); } void bar() { foomock mock; int f = 0; on_call(mock, foo()).willbydefault(return(f)); expect_true(f==mock.foo()); // correct f++; expect_true(f==mock.foo()); // failed, because on_call returns f=0 } does exists way return new value of variable? yes there way, change code to: on_call(mock, foo()) .willbydefault(returnpointee(&f)); read more returnpointee in link (in returning live values mock methods section)
Read more