i'm creating website displays content in table , want centered. centered if there 3 td's centered, want center tr in middle of 3 td's when has 2 td's.
i want test5 , test6 center in middle of other tr can't seem figure out how.
my current code:
<html> <style> #center { text-align: center; } #centertable { text-align: center; margin-left: auto; margin-right: auto; width: 50%; } </style> <div id="center"> <p>testing centered table</p> <table id="centertable"> <tr> <td> test1 </td> <td> test2 </td> <td> test3 </td> </tr> <tr> <td> test4 </td> <td> test5 </td> </tr> </table> </div> </html>
tables not used hardly @ anymore. can accomplish using div boxes , flexbox design.
heres code snippet of think you're trying accomplish made divs , flexbox design.
.box-wrap { background: #a00; display: flex; justify-content: center; flex-wrap: wrap; } .test { background: #0a0; width: 33.33%; height: 5em; display: flex; align-items: center; justify-content: center; }<div class="box-wrap"> <div class="test"> test1 </div> <div class="test"> test2 </div> <div class="test"> test3 </div> <div class="test"> test4 </div> <div class="test"> test5 </div> </div>
Comments
Post a Comment