What do you think should I do to make my code's output like in the photo?
Thank you for answering.
(I am typing any words in here because stackoverflow doesnt let me post this. This is the most detailed thing I can think of. I am new to the programming world and I have no one to assist me that's why I am asking for some help. Thank you for understanding.)
Here's my code:
<table border="1" cellpadding="20% " width="20%" cellspacing="0">
<tr>
<td rowspan="10"></td>
<td colspan="9"></td>
</tr>
<tr>
<td rowspan="9"></td>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="8"></td>
<td colspan="7"></td>
</tr>
<tr>
<td rowspan="7"></td>
<td colspan="6"></td>
</tr>
<tr>
<td rowspan="6"></td>
<td colspan="5"></td>
</tr>
<tr>
<td rowspan="5"></td>
<td colspan="4"></td>
</tr>
<tr>
<td rowspan="4"></td>
<td colspan="3"></td>
</tr>
<tr>
<td rowspan="3"></td>
<td colspan="2"></td>
</tr>
<tr>
<td rowspan="2"></td>
<td colspan="1"></td>
</tr>
<tr>
<td rowspan="0">
</td>
</tr>
</table>
enter image description here
make table inside td
<td rowspan="0" style="padding: 0; border: none;">
<table border="1" cellpadding="10% " width="20%" cellspacing="0">
<tr>
<td></td>
<td></td>
</tr><tr>
<td></td>
<td></td>
</tr>
</table>
</td>
<table border="1" cellpadding="20% " width="20%" cellspacing="0">
<tr>
<td rowspan="10"></td>
<td colspan="9"></td>
</tr>
<tr>
<td rowspan="9"></td>
<td colspan="8"></td>
</tr>
<tr>
<td rowspan="8"></td>
<td colspan="7"></td>
</tr>
<tr>
<td rowspan="7"></td>
<td colspan="6"></td>
</tr>
<tr>
<td rowspan="6"></td>
<td colspan="5"></td>
</tr>
<tr>
<td rowspan="5"></td>
<td colspan="4"></td>
</tr>
<tr>
<td rowspan="4"></td>
<td colspan="3"></td>
</tr>
<tr>
<td rowspan="3"></td>
<td colspan="2"></td>
</tr>
<tr>
<td rowspan="2"></td>
<td colspan="1"></td>
</tr>
<tr>
<td rowspan="0" style="padding: 0; border: none;">
<table border="1" cellpadding="10% " width="20%" cellspacing="0">
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
</table>
im not programer, i have json file, want to see in html file, i try to convert with https://www.convertjson.com/ its work, but thats only make a basic table, like excel, no filter, dropdown not as shown on the web preview, what should I do so that the html results are as displayed on the web
preview on the web
<table class="table table-bordered table-hover table-condensed">
<thead><tr><th title="Field #1">keyword</th>
<th title="Field #2">products</th>
<th title="Field #3">date</th>
</tr></thead>
<tbody><tr>
<td>smooth operator</td>
<td align="right">583</td>
<td align="right">1642435207616</td>
</tr>
<tr>
<td>yuke</td>
<td align="right">24</td>
<td align="right">1642436355563</td>
</tr>
<tr>
<td>yuna ffx</td>
<td align="right">433</td>
<td align="right">1642436363173</td>
</tr>
<tr>
<td>so yul</td>
<td align="right">29</td>
<td align="right">1642436365296</td>
</tr>
<tr>
<td>statistics yup</td>
<td align="right">21</td>
<td align="right">1642436368027</td>
</tr>
<tr>
<td>snooker masters</td>
<td align="right">157</td>
<td align="right">1642437410041</td>
</tr>
<tr>
<td>snooker cue</td>
<td align="right">4067</td>
<td align="right">1642437414446</td>
</tr>
<tr>
<td>snake io</td>
<td align="right">187</td>
<td align="right">1642437422957</td>
</tr>
<tr>
<td>scott morrison pm</td>
<td align="right">294</td>
<td align="right">1642439850739</td>
</tr>
<tr>
<td>school is important but surfing is importanter</td>
<td align="right">193</td>
<td align="right">1642439885920</td>
</tr>
<tr>
<td>schlatt</td>
<td align="right">1814</td>
<td align="right">1642440651019</td>
</tr>
<tr>
<td>scrunge cat</td>
<td align="right">14</td>
<td align="right">1642440653282</td>
</tr>
<tr>
<td>elite way school</td>
<td align="right">40</td>
<td align="right">1642440658943</td>
</tr>
<tr>
<td>valentines day school</td>
<td align="right">20996</td>
<td align="right">1642440944250</td>
</tr>
<tr>
<td>video game high school</td>
<td align="right">2781</td>
<td align="right">1642440972825</td>
</tr>
<tr>
<td>love scars</td>
<td align="right">1400</td>
<td align="right">1642441411736</td>
</tr>
<tr>
<td>black history is more than slavery</td>
<td align="right">441</td>
<td align="right">1642441420869</td>
</tr>
<tr>
<td>black history month facts</td>
<td align="right">3751</td>
<td align="right">1642441561952</td>
</tr>
<tr>
<td>black history month quotes</td>
<td align="right">8450</td>
<td align="right">1642441753406</td>
</tr>
<tr>
<td>black wolf with blue eyes</td>
<td align="right">62</td>
<td align="right">1642441758697</td>
</tr>
<tr>
<td>blueycapsules</td>
<td align="right">20</td>
<td align="right">1642441760393</td>
</tr>
<tr>
<td>black history month ideas</td>
<td align="right">5430</td>
<td align="right">1642441979096</td>
</tr>
<tr>
<td>blessed be the fruit loops</td>
<td align="right">45</td>
<td align="right">1642441983668</td>
</tr>
<tr>
<td>blue peter</td>
<td align="right">3346</td>
<td align="right">1642442195322</td>
</tr>
<tr>
<td>bliss</td>
<td align="right">17820</td>
<td align="right">1642442740461</td>
</tr>
<tr>
<td>black and gray</td>
<td align="right">31466</td>
<td align="right">1642443079939</td>
</tr>
<tr>
<td>blades aerobatic team</td>
<td align="right">25</td>
<td align="right">1642443083091</td>
</tr>
<tr>
<td>funny color blind</td>
<td align="right">586</td>
<td align="right">1642443702500</td>
</tr>
<tr>
<td>color blind</td>
<td align="right">2002</td>
<td align="right">1642444166164</td>
</tr>
<tr>
<td>roses are red violets are blue i want queso and tacos too</td>
<td align="right">188</td>
<td align="right">1642444171433</td>
</tr>
<tr>
<td>falling sakura cherry blossom</td>
<td align="right">419</td>
<td align="right">1642444733452</td>
</tr>
<tr>
<td>vaccinated by the blood of jesus</td>
<td align="right">237</td>
<td align="right">1642444737052</td>
</tr>
<tr>
<td>navy blue and gold</td>
<td align="right">2583</td>
<td align="right">1642445186483</td>
</tr>
<tr>
<td>the blue ark</td>
<td align="right">98</td>
<td align="right">1642445189394</td>
</tr>
<tr>
<td>roses are red violets are blue i want tacos and queso too</td>
<td align="right">188</td>
<td align="right">1642445193220</td>
</tr>
<tr>
<td>kim jong un blood</td>
<td align="right">64</td>
<td align="right">1642445195692</td>
</tr>
<tr>
<td>lick swallow</td>
<td align="right">448</td>
<td align="right">1642445201457</td>
</tr>
<tr>
<td>lion is my spirit animal</td>
<td align="right">214</td>
<td align="right">1642445204839</td>
</tr>
<tr>
<td>little valentine in the making</td>
<td align="right">458</td>
<td align="right">1642445209546</td>
</tr>
<tr>
<td>lil timmy tim</td>
<td align="right">976</td>
<td align="right">1642446416898</td>
</tr>
<tr>
<td>life begins where fear ends</td>
<td align="right">1474</td>
<td align="right">1642446421119</td>
</tr>
<tr>
<td>limewire</td>
<td align="right">113</td>
<td align="right">1642447069083</td>
</tr>
<tr>
<td>lip service</td>
<td align="right">190</td>
<td align="right">1642447084650</td>
</tr>
<tr>
<td>lily pulitzer case</td>
<td align="right">176</td>
<td align="right">1642447088493</td>
</tr>
<tr>
<td>list of products</td>
<td align="right">1861</td>
<td align="right">1642447092677</td>
</tr>
<tr>
<td>lisa bonet</td>
<td align="right">102</td>
<td align="right">1642447274533</td>
</tr>
<tr>
<td>line cook</td>
<td align="right">1660</td>
<td align="right">1642447527890</td>
</tr>
<tr>
<td>libraries matter</td>
<td align="right">303</td>
<td align="right">1642447532008</td>
</tr>
<tr>
<td>little hearts</td>
<td align="right">33597</td>
<td align="right">1642447678671</td>
</tr>
<tr>
<td>lion a skate</td>
<td align="right">195</td>
<td align="right">1642447683925</td>
</tr>
<tr>
<td>lolipop red lips</td>
<td align="right">373</td>
<td align="right">1642447704399</td>
</tr>
<tr>
<td>i lick</td>
<td align="right">1800</td>
<td align="right">1642447822094</td>
</tr>
<tr>
<td>stealing hearts like i steal pucks</td>
<td align="right">318</td>
<td align="right">1642447825677</td>
</tr>
<tr>
<td>to do list your mom</td>
<td align="right">1006</td>
<td align="right">1642447831298</td>
</tr>
<tr>
<td>she was like a shot of espresso</td>
<td align="right">103</td>
<td align="right">1642447834669</td>
</tr>
<tr>
<td>i lick i swallow</td>
<td align="right">245</td>
<td align="right">1642447837988</td>
</tr>
<tr>
<td>betty white quotes</td>
<td align="right">1733</td>
<td align="right">1642448073106</td>
</tr>
<tr>
<td>bills afc east champion</td>
<td align="right">222</td>
<td align="right">1642448076331</td>
</tr>
<tr>
<td>bills run the east</td>
<td align="right">947</td>
<td align="right">1642448081763</td>
</tr>
<tr>
<td>born year of the tiger</td>
<td align="right">1942</td>
<td align="right">1642448086454</td>
</tr>
<tr>
<td>budgie band</td>
<td align="right">163</td>
<td align="right">1642448487167</td>
</tr>
<tr>
<td>baker miller pink</td>
<td align="right">59</td>
<td align="right">1642448610822</td>
</tr>
<tr>
<td>baby we bare bears</td>
<td align="right">1073</td>
<td align="right">1642448615055</td>
</tr>
<tr>
<td>birthday january quotes</td>
<td align="right">7247</td>
<td align="right">1642448954399</td>
</tr>
<tr>
<td>buffalo bills afc east champions</td>
<td align="right">163</td>
<td align="right">1642448958555</td>
</tr>
<tr>
<td>burns night</td>
<td align="right">3268</td>
<td align="right">1642449350786</td>
</tr>
<tr>
<td>bigweld</td>
<td align="right">39</td>
<td align="right">1642449874809</td>
</tr>
<tr>
<td>being upside down is my normal</td>
<td align="right">90</td>
<td align="right">1642449878903</td>
</tr>
<tr>
<td>brushed watercolor painted sun</td>
<td align="right">115</td>
<td align="right">1642450180271</td>
</tr>
<tr>
<td>bat style</td>
<td align="right">3353</td>
<td align="right">1642450185077</td>
</tr>
<tr>
<td>boesarts</td>
<td align="right">1149</td>
<td align="right">1642450256733</td>
</tr>
<tr>
<td>bts valentine</td>
<td align="right">1797</td>
<td align="right">1642450702254</td>
</tr>
<tr>
<td>battlebots</td>
<td align="right">322</td>
<td align="right">1642450914337</td>
</tr>
<tr>
<td>basketball is my valentine</td>
<td align="right">842</td>
<td align="right">1642451575958</td>
</tr>
<tr>
<td>ace skull</td>
<td align="right">2143</td>
<td align="right">1642451656956</td>
</tr>
<tr>
<td>acrilic</td>
<td align="right">787</td>
<td align="right">1642451731038</td>
</tr>
<tr>
<td>acrobatic gymnastics</td>
<td align="right">4775</td>
<td align="right">1642451752746</td>
</tr>
<tr>
<td>activities assistant</td>
<td align="right">800</td>
<td align="right">1642451891621</td>
</tr>
<tr>
<td>actions</td>
<td align="right">123598</td>
<td align="right">1642451957042</td>
</tr>
<tr>
<td>acadiane</td>
<td align="right">17</td>
<td align="right">1642451960005</td>
</tr>
<tr>
<td>act justly micah</td>
<td align="right">256</td>
<td align="right">1642451964557</td>
</tr>
<tr>
<td>this is how i roll active</td>
<td align="right">553</td>
<td align="right">1642451969104</td>
</tr>
<tr>
<td>funny this is how i roll active</td>
<td align="right">415</td>
<td align="right">1642451973016</td>
</tr>
<tr>
<td>my hero academia memes</td>
<td align="right">4822</td>
<td align="right">1642451977420</td>
</tr>
<tr>
<td>greenhouse academy eagles</td>
<td align="right">46</td>
<td align="right">1642451979364</td>
</tr>
<tr>
<td>four aces</td>
<td align="right">622</td>
<td align="right">1642452128394</td>
</tr>
<tr>
<td>randy rhoads</td>
<td align="right">160</td>
<td align="right">1642452287605</td>
</tr>
<tr>
<td>ragnarok netflix</td>
<td align="right">77</td>
<td align="right">1642452290275</td>
</tr>
<tr>
<td>rainbow polka dot</td>
<td align="right">4098</td>
<td align="right">1642452309938</td>
</tr>
<tr>
<td>rand paul</td>
<td align="right">885</td>
<td align="right">1642452396472</td>
</tr>
<tr>
<td>ranch hand</td>
<td align="right">595</td>
<td align="right">1642452422401</td>
</tr>
<tr>
<td>rancor</td>
<td align="right">99</td>
<td align="right">1642452635933</td>
</tr>
<tr>
<td>rapists</td>
<td align="right">221</td>
<td align="right">1642452638614</td>
</tr>
<tr>
<td>randy moss straight cash homie</td>
<td align="right">88</td>
<td align="right">1642452641640</td>
</tr>
<tr>
<td>rapper collage</td>
<td align="right">1297</td>
<td align="right">1642452645635</td>
</tr>
<tr>
<td>rainytale studio</td>
<td align="right">64</td>
<td align="right">1642452649264</td>
</tr>
<tr>
<td>i teach the sweetest hearts rainbow teacher valentines day</td>
<td align="right">246</td>
<td align="right">1642452653877</td>
</tr>
<tr>
<td>yellowstone dutton ranch arrows</td>
<td align="right">18</td>
<td align="right">1642452656675</td>
</tr>
<tr>
<td>tusken raider</td>
<td align="right">72</td>
<td align="right">1642452917407</td>
</tr>
<tr>
<td>i would rather be with my cat</td>
<td align="right">393</td>
<td align="right">1642452922279</td>
</tr>
<tr>
<td>cat eating ramen cute noodles</td>
<td align="right">1140</td>
<td align="right">1642452926838</td>
</tr>
<tr>
<td>professional rawdogger</td>
<td align="right">58</td>
<td align="right">1642453027048</td>
</tr>
<tr>
<td>i find this rather humerus</td>
<td align="right">36</td>
<td align="right">1642453030104</td>
</tr>
<tr>
<td>luke rawlings</td>
<td align="right">36</td>
<td align="right">1642453032163</td>
</tr>
<tr>
<td>ham radio call</td>
<td align="right">153</td>
<td align="right">1642453035613</td>
</tr>
<tr>
<td>self care rap</td>
<td align="right">331</td>
<td align="right">1642453038717</td>
</tr>
<tr>
<td>mcbean tartan</td>
<td align="right">15</td>
<td align="right">1642453043739</td>
</tr>
<tr>
<td>mclaren formula one</td>
<td align="right">3221</td>
<td align="right">1642453046775</td>
</tr>
<tr>
<td>reba mcentire tour</td>
<td align="right">98</td>
<td align="right">1642453051029</td>
</tr>
<tr>
<td>lea roche</td>
<td align="right">590</td>
<td align="right">1642453349110</td>
</tr>
<tr>
<td>leicester tigers</td>
<td align="right">79</td>
<td align="right">1642453459842</td>
</tr>
<tr>
<td>lesbian valentines day</td>
<td align="right">6934</td>
<td align="right">1642454643197</td>
</tr>
<tr>
<td>lets go darwin funny</td>
<td align="right">3229</td>
<td align="right">1642454791946</td>
</tr>
<tr>
<td>let them go</td>
<td align="right">1972</td>
<td align="right">1642454819221</td>
</tr>
<tr>
<td>leek</td>
<td align="right">2241</td>
<td align="right">1642454870409</td>
</tr>
<tr>
<td>levin</td>
<td align="right">1552</td>
<td align="right">1642454897230</td>
</tr>
<tr>
<td>xmas cookie shaped letter</td>
<td align="right">99</td>
<td align="right">1642454900902</td>
</tr>
<tr>
<td>i left my bed for this</td>
<td align="right">942</td>
<td align="right">1642454906398</td>
</tr>
<tr>
<td>for the legneds for the legneds for the legneds for the legneds</td>
<td align="right">57</td>
<td align="right">1642454908997</td>
</tr>
<tr>
<td>the crow brandon lee</td>
<td align="right">466</td>
<td align="right">1642454912088</td>
</tr>
<tr>
<td>at least my cat loves me</td>
<td align="right">1355</td>
<td align="right">1642454917028</td>
</tr>
<tr>
<td>various not less</td>
<td align="right">1933</td>
<td align="right">1642454922062</td>
</tr>
<tr>
<td>the boring company</td>
<td align="right">303</td>
<td align="right">1642455022212</td>
</tr>
<tr>
<td>this man ate my son</td>
<td align="right">426</td>
<td align="right">1642455025389</td>
</tr>
<tr>
<td>thai pongal</td>
<td align="right">59</td>
<td align="right">1642455126732</td>
</tr>
<tr>
<td>the danger zone</td>
<td align="right">639</td>
<td align="right">1642455131603</td>
</tr>
<tr>
<td>the ultimate taco twosday</td>
<td align="right">22222</td>
<td align="right">1642455136173</td>
</tr>
<tr>
<td>the expanse rocinante</td>
<td align="right">188</td>
<td align="right">1642455333142</td>
</tr>
<tr>
<td>the ronettes</td>
<td align="right">145</td>
<td align="right">1642456152057</td>
</tr>
<tr>
<td>the force is strong with this teacher</td>
<td align="right">527</td>
<td align="right">1642456157248</td>
</tr>
<tr>
<td>the cheesecake factory</td>
<td align="right">53</td>
<td align="right">1642456160724</td>
</tr>
<tr>
<td>the book of boba</td>
<td align="right">230</td>
<td align="right">1642456164173</td>
</tr>
<tr>
<td>the witcher medallion</td>
<td align="right">82</td>
<td align="right">1642456166848</td>
</tr>
<tr>
<td>the office valentine</td>
<td align="right">2802</td>
<td align="right">1642456171043</td>
</tr>
<tr>
<td>the rumbling</td>
<td align="right">112</td>
<td align="right">1642456596843</td>
</tr>
<tr>
<td>this teacher loves her kids</td>
<td align="right">3883</td>
<td align="right">1642456601430</td>
</tr>
<tr>
<td>thomas petrou</td>
<td align="right">197</td>
<td align="right">1642456727484</td>
</tr>
<tr>
<td>the orion experience</td>
<td align="right">21</td>
<td align="right">1642456729374</td>
</tr>
<tr>
<td>the sweetest valentine of them all</td>
<td align="right">169</td>
<td align="right">1642456735384</td>
</tr>
<tr>
<td>the girl on the couch</td>
<td align="right">181</td>
<td align="right">1642456738884</td>
</tr>
</tbody></table>
So to keep it simple let's say you have the code for a table stored in a document called tableview.html
Your html document needs a few extra essential lines of code before it works like you want it do. In tableview.html you first add the code below in an simple text-editor like Notepad. Then copy-paste your <table>....</table> code that you've shown in your question between the <body>... </body> part.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
<title>DataTables example - Zero configuration</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.3/css/dataTables.bootstrap5.min.css">
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
<script> $(document).ready(function() {$('table').DataTable();} ); </script>
</head>
<body>
</body>
</html>
End for the finishing touch you might want to add the class table-striped in your first line of the table, like:
<table class="table table-bordered table-hover table-condensed table-striped">
You can use bootstrap librariy.
https://getbootstrap.com/docs/4.0/content/tables/
Or, you can use open-source javascript grid libraries.
https://blog.logrocket.com/5-open-source-javascript-datagrids/
I have a table that on the right has 2 Columns (2018 and 2017) with numbers underneath. I'm trying to separate those columns and have them separated by a white column with the border going to the end.I've added the html, I also have css but I'm just having a hard time separating while keeping the borders.
<table class="table">
<tbody>
<tr>
<td class="table-head-text top-table-text">Assets</td>
<td class="table-year-1 bold">2018</td>
<td class="table-year-2 bold">2017</td>
</tr>
<tr>
<td>Cash & Due From Banks</td>
<td class="table-year-1">$149,753</td>
<td class="table-year-2">$77,515</td>
</tr>
<tr>
<td>Investment Securities</td>
<td class="table-year-1">$929,432</td>
<td class="table-year-2">$830,878</td>
</tr>
<tr>
<td>Loans (net of valuation reserve)<br />
($28,582 in 2018 & $27,063 in 2017)</td>
<td class="table-year-1">$1,902,960</td>
<td class="table-year-2">$1,813,062</td>
</tr>
<tr>
<td>Federal Funds Sold</td>
<td class="table-year-1">$0</td>
<td class="table-year-2">$0</td>
</tr>
<tr>
<td>Premises & Equipment</td>
<td class="table-year-1">$49,956</td>
<td class="table-year-2">$46,666</td>
</tr>
<tr>
<td>Accured Income</td>
<td class="table-year-1">$12,652</td>
<td class="table-year-2">$12,589</td>
</tr>
<tr>
<td>Other Assets</td>
<td class="table-year-1">$111,287</td>
<td class="table-year-2">$102,413</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Assets</td>
<td class="table-year-1 bold">$3,156,040</td>
<td class="table-year-2 bold">$2,883,123</td>
</tr>
<tr>
<td class="table-head-text">Liabilities & Capital Funds</td>
<td class="table-year-1"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td>Non-Interest Bearing Deposits</td>
<td class="table-year-1">$952,623</td>
<td class="table-year-2">$894,075</td>
</tr>
<tr>
<td>Non-Interest Bearing Public Deposits</td>
<td class="table-year-1">$190,104</td>
<td class="table-year-2">$179,582</td>
</tr>
<tr>
<td>Interest Bearing Deposits</td>
<td class="table-year-1">$1,344,490</td>
<td class="table-year-2">$1,194,226</td>
</tr>
<tr>
<td>Interest Bearing<br />
Public Deposits</td>
<td class="table-year-1">$370,094</td>
<td class="table-year-2">$274,994</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Deposits</td>
<td class="table-year-1 bold">$2,857,311</td>
<td class="table-year-2 bold">$2,542,877</td>
</tr>
<tr>
<td>Other Liabilities</td>
<td class="table-year-1">$22,497</td>
<td class="table-year-2">$22,954</td>
</tr>
<tr>
<td>Fed Funds Purchase & Other Borrowed Money</td>
<td class="table-year-1">$0</td>
<td class="table-year-2">$63,394</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Liabilities</td>
<td class="table-year-1 bold">$2,879,808</td>
<td class="table-year-2 bold ">$2,629,225</td>
</tr>
<tr>
<td class="table-head-text">Capital Accounts</td>
<td class="table-year-1"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td>Capital Stock</td>
<td class="table-year-1">$2,500</td>
<td class="table-year-2">$2,500</td>
</tr>
<tr>
<td>Surplus</td>
<td class="table-year-1">$100,943</td>
<td class="table-year-2">$79,188</td>
</tr>
<tr>
<td>Undivided Profits</td>
<td class="table-year-1">$188,173</td>
<td class="table-year-2">$177,768</td>
</tr>
<tr>
<td>Unrealized Gain <span class="loss-span">(Loss) Securities</span></td>
<td class="table-year-1">($15,384)</td>
<td class="table-year-2">($5,558)</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Capital Accounts</td>
<td class="table-year-1 bold">$276,232</td>
<td class="table-year-2 bold">$253,898</td>
</tr>
<tr>
<td class="table-head-text bk">Total Liabilities & Capital Accounts</td>
<td class="table-year-1 bold">$3,156,040</td>
<td class="table-year-2 bold">$2,883,123</td>
</tr>
<tr class="tr-border-top">
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
This is the example I'm trying to get to
You can try this code:
<table class="table">
<thead>
<tr>
<th width="70%" class="table-head-text top-table-text">Assets</td>
<th width="15%" class="table-year-1 bold">2018</td>
<th width="15%" class="table-year-2 bold">2017</td>
</tr>
</thead>
<tbody>
<tr>
<td>Cash & Due From Banks</td>
<td class="table-year-1">$149,753</td>
<td class="table-year-2">$77,515</td>
</tr>
<tr>
<td>Investment Securities</td>
<td class="table-year-1">$929,432</td>
<td class="table-year-2">$830,878</td>
</tr>
<tr>
<td>Loans (net of valuation reserve)<br />
($28,582 in 2018 & $27,063 in 2017)</td>
<td class="table-year-1">$1,902,960</td>
<td class="table-year-2">$1,813,062</td>
</tr>
<tr>
<td>Federal Funds Sold</td>
<td class="table-year-1">$0</td>
<td class="table-year-2">$0</td>
</tr>
<tr>
<td>Premises & Equipment</td>
<td class="table-year-1">$49,956</td>
<td class="table-year-2">$46,666</td>
</tr>
<tr>
<td>Accured Income</td>
<td class="table-year-1">$12,652</td>
<td class="table-year-2">$12,589</td>
</tr>
<tr>
<td>Other Assets</td>
<td class="table-year-1">$111,287</td>
<td class="table-year-2">$102,413</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Assets</td>
<td class="table-year-1 bold">$3,156,040</td>
<td class="table-year-2 bold">$2,883,123</td>
</tr>
<tr>
<td class="table-head-text">Liabilities & Capital Funds</td>
<td class="table-year-1"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td>Non-Interest Bearing Deposits</td>
<td class="table-year-1">$952,623</td>
<td class="table-year-2">$894,075</td>
</tr>
<tr>
<td>Non-Interest Bearing Public Deposits</td>
<td class="table-year-1">$190,104</td>
<td class="table-year-2">$179,582</td>
</tr>
<tr>
<td>Interest Bearing Deposits</td>
<td class="table-year-1">$1,344,490</td>
<td class="table-year-2">$1,194,226</td>
</tr>
<tr>
<td>Interest Bearing<br />
Public Deposits</td>
<td class="table-year-1">$370,094</td>
<td class="table-year-2">$274,994</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Deposits</td>
<td class="table-year-1 bold">$2,857,311</td>
<td class="table-year-2 bold">$2,542,877</td>
</tr>
<tr>
<td>Other Liabilities</td>
<td class="table-year-1">$22,497</td>
<td class="table-year-2">$22,954</td>
</tr>
<tr>
<td>Fed Funds Purchase & Other Borrowed Money</td>
<td class="table-year-1">$0</td>
<td class="table-year-2">$63,394</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Liabilities</td>
<td class="table-year-1 bold">$2,879,808</td>
<td class="table-year-2 bold ">$2,629,225</td>
</tr>
<tr>
<td class="table-head-text">Capital Accounts</td>
<td class="table-year-1"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td>Capital Stock</td>
<td class="table-year-1">$2,500</td>
<td class="table-year-2">$2,500</td>
</tr>
<tr>
<td>Surplus</td>
<td class="table-year-1">$100,943</td>
<td class="table-year-2">$79,188</td>
</tr>
<tr>
<td>Undivided Profits</td>
<td class="table-year-1">$188,173</td>
<td class="table-year-2">$177,768</td>
</tr>
<tr>
<td>Unrealized Gain <span class="loss-span">(Loss) Securities</span></td>
<td class="table-year-1">($15,384)</td>
<td class="table-year-2">($5,558)</td>
</tr>
<tr class="tr-border">
<td class="table-head-text">Total Capital Accounts</td>
<td class="table-year-1 bold">$276,232</td>
<td class="table-year-2 bold">$253,898</td>
</tr>
<tr>
<td class="table-head-text bk">Total Liabilities & Capital Accounts</td>
<td class="table-year-1 bold">$3,156,040</td>
<td class="table-year-2 bold">$2,883,123</td>
</tr>
<tr class="tr-border-top">
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
table thead tr th:last-child{
display:table;
margin-left:90px
}
table tbody tr td:last-child{
display:table;
margin-left:90px
}
I have a table which is like
You can see the border below Operation Research, under the course column. I want that border to be removed, but the code I've written is not working, what exactly should I do?
<html>
<body>
<table width="100%" border="1" rules="cols" style="border-collapse : collapse;">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>
</body>
</html>
Since it is border of table you have to remove that.
Use following code
<html>
<body>
<table width="100%" border="1" rules="cols" style="border : none;">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2" style="border : solid thin;">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>
</body>
</html>
If you mean the border-bottom of main table then just set it's border-bottom:none; as below,
<table width="100%" border="1" rules="cols" style="border-collapse : collapse;border-bottom:none">
<tr>
<td align="center" width="54%" style="border : solid thin;">Courses</td>
<td align="center" width="23%" style="border : solid thin;">CGPA</td>
<td align="center" width="23%" style="border : solid thin;">Credit</td>
</tr>
<tr>
<td>English Language Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Additional Language Course<br> French</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Foundation Course</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Core Course<br>Physics<br> Physics</td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td>Complementary Course(s) <br> Mathematics <br> Chemsitry </td>
<td align="center">8.1</td>
<td align="center">19</td>
</tr>
<tr>
<td style="border-bottom : none;">Open Course <br> Operations Research</td>
<td align="center" style="border-bottom : solid thin;">8.1</td>
<td align="center" style="border-bottom : solid thin;">19</td>
</tr>
<tr height="35px">
<td></td>
<td align="center" colspan="2" style="border-bottom:solid thin">Semester wise SCPA</td>
</tr>
</table>
<table width="100%">
<tr>
</tr>
</table>
It seems easy but can't write the HTML code of the above table.
Here is what I tried so far:
<table border="1" style="border-collapse:collapse;" width="25%">
<tr>
<td>col1</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</table>
Sure you want html??
<table align="center" width="590" height="590" >
<tr>
<td align="center" height="80" colspan="4">central text</td>
</tr>
<tr>
<td align="center" height="80" colspan="2">col</td>
<td align="center" colspan="2">col</td>
</tr>
<tr>
<td align="center" height="40">t</td>
<td align="center" height="40">t</td>
<td align="center" height="80" rowspan="2">t</td>
<td align="center" rowspan="2">t</td>
</tr>
<tr>
<td align="center" height="40">t</td>
<td align="center" height="40">t</td>
</tr>
<tr>
<td align="center" height="30">t</td>
<td align="center" >t</td>
<td align="center" >t</td>
<td align="center" >t</td>
</tr>
</table>
Like this?
colspan and rowspan was missing from your code.
<table border="1" style="border-collapse: collapse;">
<tr>
<td colspan=4 align="center">central text</td>
</tr>
<tr>
<td colspan=2 align="center">col(1)</td>
<td colspan=2 align="center">col(2)</td>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
<td rowspan=2 align="center">text</td>
<td rowspan=2 align="center">text</td>
</tr>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
</tr>
<tr>
<td align="center">text</td>
<td align="center">text</td>
<td align="center">text</td>
<td align="center">text</td>
</tr>
</table>