Ms word table not work proper

Posted in: Newspaper
Post count: 90

Sir I creat a website I use a ms world table in my post buy after use my table title column separate left site
My post

Post count: 18283

Hello !

For tables we recommend you using a html table generator like this: https://www.tablesgenerator.com/html_tables#

Thank you !

Post count: 90

<style type="text/css">
.tg {border-collapse:collapse;border-spacing:0;border-color:#aaa;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:17px 20px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#aaa;color:#333;background-color:#fff;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:17px 20px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#aaa;color:#fff;background-color:#f38630;}
.tg .tg-swmu{font-size:12px;font-family:"Arial Black", Gadget, sans-serif !important;;border-color:inherit;text-align:center;vertical-align:top;position:sticky;position:-webkit-sticky;top:-1px;will-change:transform}
.tg .tg-f4iu{font-size:12px;border-color:inherit;text-align:center;vertical-align:top}
.tg-sort-header::-moz-selection{background:0 0}.tg-sort-header::selection{background:0 0}.tg-sort-header{cursor:pointer}.tg-sort-header:after{content:'';float:right;margin-top:7px;border-width:0 5px 5px;border-style:solid;border-color:#404040 transparent;visibility:hidden}.tg-sort-header:hover:after{visibility:visible}.tg-sort-asc:after,.tg-sort-asc:hover:after,.tg-sort-desc:after{visibility:visible;opacity:.4}.tg-sort-desc:after{border-bottom:none;border-width:5px 5px 0}</style>
<table id="tg-1P1ck" class="tg">
<tr>
<th class="tg-swmu" colspan="4">Total Vacancy Details</th>
</tr>
<tr>
<td class="tg-f4iu" colspan="4">Graduate Executive Trainee</td>
</tr>
<tr>
<td class="tg-f4iu">S.no</td>
<td class="tg-f4iu">Post name</td>
<td class="tg-f4iu">Number of Post</td>
<td class="tg-f4iu">Qualification</td>
</tr>
<tr>
<td class="tg-f4iu">1</td>
<td class="tg-f4iu">Mechanical</td>
<td class="tg-f4iu">125</td>
<td class="tg-f4iu">Bachelor Degree (Mechanical Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">2</td>
<td class="tg-f4iu">Electrical (EEE)</td>
<td class="tg-f4iu">65</td>
<td class="tg-f4iu">Bachelor Degree (Electrical Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">3</td>
<td class="tg-f4iu">Electrical (ECE)</td>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Bachelor Degree (Electronics &amp; Communication Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">4</td>
<td class="tg-f4iu">Civil</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Civil Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Control &amp; Instrumentation</td>
<td class="tg-f4iu">15</td>
<td class="tg-f4iu">Bachelor Degree (Instrumentation &amp;</td>
</tr>
<tr>
<td class="tg-f4iu">6</td>
<td class="tg-f4iu">Computer</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Computer Science/ Computer Engg/ Information Technology)/ PG Degree (Computer)</td>
</tr>
<tr>
<td class="tg-f4iu">7</td>
<td class="tg-f4iu">Mining</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Mining Engineering)</td>
</tr>
<tr>
<td class="tg-f4iu">8</td>
<td class="tg-f4iu">Geology</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">M.Tech/ M.Sc (Geology)</td>
</tr>
<tr>
<td class="tg-f4iu">9</td>
<td class="tg-f4iu">Finance</td>
<td class="tg-f4iu">14</td>
<td class="tg-f4iu">CA/ CMA/ Degree (Any Discipline)</td>
</tr>
<tr>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Human Resource</td>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Degree (Any Discipline), PG Degree/ Diploma (Relevant Discipline)</td>
</tr>
</table>
<script charset="utf-8">var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&e.push(n)}),e}var a=parseFloat;function i(n,r){return function(t){var e="";return t.replace(n,function(n,t,o){return e=t.replace(r,"")+"."+(o||"").substring(1)}),a(e)}}var s=i(/^(?:\s*)([+-]?(?:\d+)(?:,\d{3})*)(\.\d*)?$/g,/,/g),c=i(/^(?:\s*)([+-]?(?:\d+)(?:\.\d{3})*)(,\d*)?$/g,/\./g);function f(n){var t=a(n);return!isNaN(t)&&r(""+t)+1>=r(n)?t:NaN}function d(n){var e=[],o=n;return t([f,s,c],function(u){var a=[],i=[];t(n,function(n,r){r=u(n),a.push(r),r||i.push(n)}),r(i)<r(o)&&(o=i,e=a)}),r(u(o,function(n){return n==o[0]}))==r(o)?e:[]}function v(n){if("TABLE"==n.nodeName){for(var a=function(r){var e,o,u=[],a=[];return function n(r,e){e(r),t(r.childNodes,function(r){n(r,e)})}(n,function(n){"TR"==(o=n.nodeName)?(e=[],u.push(e),a.push(n)):"TD"!=o&&"TH"!=o||e.push(n)}),[u,a]}(),i=a[0],s=a[1],c=r(i),f=c>1&&r(i[0])<r(i[1])?1:0,v=f+1,p=i[f],h=r(p),l=[],g=[],N=[],m=v;m<c;++m){for(var T=0;T<h;++T){r(g)<h&&g.push([]);var C=i[m][T],L=C.textContent||C.innerText||"";g[T].push(L.trim())}N.push(m-v)}t(p,function(n,t){l[t]=0;var a=n.classList;a.add("tg-sort-header"),n.addEventListener("click",function(){var n=l[t];!function(){for(var n=0;n<h;++n){var r=p[n].classList;r.remove("tg-sort-asc"),r.remove("tg-sort-desc"),l[n]=0}}(),(n=1==n?-1:+!n)&&a.add(n>0?"tg-sort-asc":"tg-sort-desc"),l[t]=n;var i,f=g[t],m=function(r,t){return n*f[r].localeCompare(f[t])||n*(r-t)},T=function(n){var t=d(n);if(!r(t)){var u=o(n),a=o(n.map(e));t=d(n.map(function(n){return n.substring(u,r(n)-a)}))}return t}(f);(r(T)||r(T=r(u(i=f.map(Date.parse),isNaN))?[]:i))&&(m=function(r,t){var e=T[r],o=T[t],u=isNaN(e),a=isNaN(o);return u&&a?0:u?-n:a?n:e>o?n:e<o?-n:n*(r-t)});var C,L=N.slice();L.sort(m);for(var E=v;E<c;++E)(C=s[E].parentNode).removeChild(s[E]);for(E=v;E<c;++E)C.appendChild(s[v+L[E-v]])})})}}n.addEventListener("DOMContentLoaded",function(){for(var t=n.getElementsByClassName("tg"),e=0;e<r(t);++e)try{v(t[e])}catch(n){}})}(document)</script>

Post count: 90

i creat table http://tablesgenerator.com/ but not work in my post please explane how to use my table is
<style type="text/css">
.tg {border-collapse:collapse;border-spacing:0;border-color:#aaa;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:17px 20px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#aaa;color:#333;background-color:#fff;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:17px 20px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#aaa;color:#fff;background-color:#f38630;}
.tg .tg-swmu{font-size:12px;font-family:"Arial Black", Gadget, sans-serif !important;;border-color:inherit;text-align:center;vertical-align:top;position:sticky;position:-webkit-sticky;top:-1px;will-change:transform}
.tg .tg-f4iu{font-size:12px;border-color:inherit;text-align:center;vertical-align:top}
.tg-sort-header::-moz-selection{background:0 0}.tg-sort-header::selection{background:0 0}.tg-sort-header{cursor:pointer}.tg-sort-header:after{content:'';float:right;margin-top:7px;border-width:0 5px 5px;border-style:solid;border-color:#404040 transparent;visibility:hidden}.tg-sort-header:hover:after{visibility:visible}.tg-sort-asc:after,.tg-sort-asc:hover:after,.tg-sort-desc:after{visibility:visible;opacity:.4}.tg-sort-desc:after{border-bottom:none;border-width:5px 5px 0}</style>
<table id="tg-1P1ck" class="tg">
<tr>
<th class="tg-swmu" colspan="4">Total Vacancy Details</th>
</tr>
<tr>
<td class="tg-f4iu" colspan="4">Graduate Executive Trainee</td>
</tr>
<tr>
<td class="tg-f4iu">S.no</td>
<td class="tg-f4iu">Post name</td>
<td class="tg-f4iu">Number of Post</td>
<td class="tg-f4iu">Qualification</td>
</tr>
<tr>
<td class="tg-f4iu">1</td>
<td class="tg-f4iu">Mechanical</td>
<td class="tg-f4iu">125</td>
<td class="tg-f4iu">Bachelor Degree (Mechanical Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">2</td>
<td class="tg-f4iu">Electrical (EEE)</td>
<td class="tg-f4iu">65</td>
<td class="tg-f4iu">Bachelor Degree (Electrical Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">3</td>
<td class="tg-f4iu">Electrical (ECE)</td>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Bachelor Degree (Electronics &amp; Communication Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">4</td>
<td class="tg-f4iu">Civil</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Civil Engg)</td>
</tr>
<tr>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Control &amp; Instrumentation</td>
<td class="tg-f4iu">15</td>
<td class="tg-f4iu">Bachelor Degree (Instrumentation &amp;</td>
</tr>
<tr>
<td class="tg-f4iu">6</td>
<td class="tg-f4iu">Computer</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Computer Science/ Computer Engg/ Information Technology)/ PG Degree (Computer)</td>
</tr>
<tr>
<td class="tg-f4iu">7</td>
<td class="tg-f4iu">Mining</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">Bachelor Degree (Mining Engineering)</td>
</tr>
<tr>
<td class="tg-f4iu">8</td>
<td class="tg-f4iu">Geology</td>
<td class="tg-f4iu">5</td>
<td class="tg-f4iu">M.Tech/ M.Sc (Geology)</td>
</tr>
<tr>
<td class="tg-f4iu">9</td>
<td class="tg-f4iu">Finance</td>
<td class="tg-f4iu">14</td>
<td class="tg-f4iu">CA/ CMA/ Degree (Any Discipline)</td>
</tr>
<tr>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Human Resource</td>
<td class="tg-f4iu">10</td>
<td class="tg-f4iu">Degree (Any Discipline), PG Degree/ Diploma (Relevant Discipline)</td>
</tr>
</table>
<script charset="utf-8">var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&e.push(n)}),e}var a=parseFloat;function i(n,r){return function(t){var e="";return t.replace(n,function(n,t,o){return e=t.replace(r,"")+"."+(o||"").substring(1)}),a(e)}}var s=i(/^(?:\s*)([+-]?(?:\d+)(?:,\d{3})*)(\.\d*)?$/g,/,/g),c=i(/^(?:\s*)([+-]?(?:\d+)(?:\.\d{3})*)(,\d*)?$/g,/\./g);function f(n){var t=a(n);return!isNaN(t)&&r(""+t)+1>=r(n)?t:NaN}function d(n){var e=[],o=n;return t([f,s,c],function(u){var a=[],i=[];t(n,function(n,r){r=u(n),a.push(r),r||i.push(n)}),r(i)<r(o)&&(o=i,e=a)}),r(u(o,function(n){return n==o[0]}))==r(o)?e:[]}function v(n){if("TABLE"==n.nodeName){for(var a=function(r){var e,o,u=[],a=[];return function n(r,e){e(r),t(r.childNodes,function(r){n(r,e)})}(n,function(n){"TR"==(o=n.nodeName)?(e=[],u.push(e),a.push(n)):"TD"!=o&&"TH"!=o||e.push(n)}),[u,a]}(),i=a[0],s=a[1],c=r(i),f=c>1&&r(i[0])<r(i[1])?1:0,v=f+1,p=i[f],h=r(p),l=[],g=[],N=[],m=v;m<c;++m){for(var T=0;T<h;++T){r(g)<h&&g.push([]);var C=i[m][T],L=C.textContent||C.innerText||"";g[T].push(L.trim())}N.push(m-v)}t(p,function(n,t){l[t]=0;var a=n.classList;a.add("tg-sort-header"),n.addEventListener("click",function(){var n=l[t];!function(){for(var n=0;n<h;++n){var r=p[n].classList;r.remove("tg-sort-asc"),r.remove("tg-sort-desc"),l[n]=0}}(),(n=1==n?-1:+!n)&&a.add(n>0?"tg-sort-asc":"tg-sort-desc"),l[t]=n;var i,f=g[t],m=function(r,t){return n*f[r].localeCompare(f[t])||n*(r-t)},T=function(n){var t=d(n);if(!r(t)){var u=o(n),a=o(n.map(e));t=d(n.map(function(n){return n.substring(u,r(n)-a)}))}return t}(f);(r(T)||r(T=r(u(i=f.map(Date.parse),isNaN))?[]:i))&&(m=function(r,t){var e=T[r],o=T[t],u=isNaN(e),a=isNaN(o);return u&&a?0:u?-n:a?n:e>o?n:e<o?-n:n*(r-t)});var C,L=N.slice();L.sort(m);for(var E=v;E<c;++E)(C=s[E].parentNode).removeChild(s[E]);for(E=v;E<c;++E)C.appendChild(s[v+L[E-v]])})})}}n.addEventListener("DOMContentLoaded",function(){for(var t=n.getElementsByClassName("tg"),e=0;e<r(t);++e)try{v(t[e])}catch(n){}})}(document)</script>

Post count: 35449

Hi,

The problem is that your table is set to 100% width and if you want to display it like that you need to remove the sidebar from this post like this -> https://i.imgur.com/NFN923G.png

Hope this will help you!
Thank you!

Post count: 90

This is a scrolling table so not a 100% width problem
Tell me how to use this table because I paste this code in html code not show any deta because code contains css+html , and I paste only table code without using CSS table is work (<table..... .....</table>)
Please tell us where a past this code
Because I use a simple table but simple column separate to left side Table post solve tha problem

Post count: 35449

Hi,

So the problem is that you do not know where to set the code to display in the proper way the table, if this is the problem, then you can set this code in post in code editor like this -> https://i.imgur.com/DiFnhcj.png and the results will be this -> https://i.imgur.com/4Z2IWhR.png

Hope this is what you need!
Thank you!

Post count: 90

your table is normal but my table code is css contain

Post count: 35449

Hi,

So there is more code? I set exactly the same code you provide, if there is more code and this is css code, you can set it in theme pane > custom code> custom css.
If this is not what you mean, please provide some more detects and some screenshots with the way it should look the tables.

Thank you for your understanding!

Post count: 90

I create a table website – https://www.tablesgenerator.com/html_tables#
I also give image blow i create a design table in website and website give a html code so i copy this code and paste post not show this type table I gave u a all image or website please solve the problem
creating table – https://www.screencast.com/t/Bjy4DXhNv
i want a this type – https://www.screencast.com/t/s9UZiOiEuce
scrollable table – https://www.screencast.com/t/LJwVCz9YK

Post count: 90

table code is <style type="text/css">
.tg {border-collapse:collapse;border-spacing:0;border-color:#bbb;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#bbb;color:#594F4F;background-color:#E0FFEB;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#bbb;color:#493F3F;background-color:#9DE0AD;}
.tg .tg-c3ow{border-color:inherit;text-align:center;vertical-align:top}
.tg .tg-4qqe{font-weight:bold;font-size:22px;border-color:inherit;text-align:center;vertical-align:top}
.tg .tg-7jts{font-size:18px;border-color:inherit;text-align:center;vertical-align:top}
.tg-sort-header::-moz-selection{background:0 0}.tg-sort-header::selection{background:0 0}.tg-sort-header{cursor:pointer}.tg-sort-header:after{content:'';float:right;margin-top:7px;border-width:0 5px 5px;border-style:solid;border-color:#404040 transparent;visibility:hidden}.tg-sort-header:hover:after{visibility:visible}.tg-sort-asc:after,.tg-sort-asc:hover:after,.tg-sort-desc:after{visibility:visible;opacity:.4}.tg-sort-desc:after{border-bottom:none;border-width:5px 5px 0}</style>
<table id="tg-WD84p" class="tg">
<tr>
<th class="tg-4qqe" colspan="4"><br> Total Vacancy Details<br> </th>
</tr>
<tr>
<td class="tg-7jts" colspan="4"><br> Graduate Executive Trainee<br> NEW JOB NOTIFICATION</td>
</tr>
<tr>
<td class="tg-c3ow"><br>  S.No<br>  </td>
<td class="tg-c3ow"><br>  Post name<br>  </td>
<td class="tg-c3ow"><br>  Number of Post<br>  </td>
<td class="tg-c3ow"><br>  Qualification<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  1<br>  </td>
<td class="tg-c3ow"><br>  Mechanical<br>  </td>
<td class="tg-c3ow"><br>  125<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Mechanical<br>  Engg)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  2<br>  </td>
<td class="tg-c3ow"><br>  Electrical (EEE)<br>  </td>
<td class="tg-c3ow"><br>  65<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Electrical<br>  Engg)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  3<br>  </td>
<td class="tg-c3ow"><br>  Electrical (ECE)<br>  </td>
<td class="tg-c3ow"><br>  10<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Electronics<br>  & Communication Engg)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  4<br>  </td>
<td class="tg-c3ow"><br>  Civil<br>  </td>
<td class="tg-c3ow"><br>  5<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Civil Engg)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  5<br>  </td>
<td class="tg-c3ow"><br>  Control &<br>  Instrumentation<br>  </td>
<td class="tg-c3ow"><br>  15<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree<br>  (Instrumentation &<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  6<br>  </td>
<td class="tg-c3ow"><br>  Computer<br>  </td>
<td class="tg-c3ow"><br>  5<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Computer<br>  Science/ Computer Engg/ Information Technology)/ PG Degree (Computer)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  7<br>  </td>
<td class="tg-c3ow"><br>  Mining<br>  </td>
<td class="tg-c3ow"><br>  5<br>  </td>
<td class="tg-c3ow"><br>  Bachelor Degree (Mining<br>  Engineering)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  8<br>  </td>
<td class="tg-c3ow"><br>  Geology<br>  </td>
<td class="tg-c3ow"><br>  5<br>  </td>
<td class="tg-c3ow"><br>  M.Tech/ M.Sc (Geology)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  9<br>  </td>
<td class="tg-c3ow"><br>  Finance<br>  </td>
<td class="tg-c3ow"><br>  14<br>  </td>
<td class="tg-c3ow"><br>  CA/ CMA/ Degree (Any<br>  Discipline)<br>  </td>
</tr>
<tr>
<td class="tg-c3ow"><br>  10<br>  </td>
<td class="tg-c3ow"><br>  Human Resource<br>  </td>
<td class="tg-c3ow"><br>  10<br>  </td>
<td class="tg-c3ow"><br>  Degree (Any Discipline), PG<br>  Degree/ Diploma (Relevant Discipline)<br>  </td>
</tr>
</table>
<script charset="utf-8">var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&e.push(n)}),e}var a=parseFloat;function i(n,r){return function(t){var e="";return t.replace(n,function(n,t,o){return e=t.replace(r,"")+"."+(o||"").substring(1)}),a(e)}}var s=i(/^(?:\s*)([+-]?(?:\d+)(?:,\d{3})*)(\.\d*)?$/g,/,/g),c=i(/^(?:\s*)([+-]?(?:\d+)(?:\.\d{3})*)(,\d*)?$/g,/\./g);function f(n){var t=a(n);return!isNaN(t)&&r(""+t)+1>=r(n)?t:NaN}function d(n){var e=[],o=n;return t([f,s,c],function(u){var a=[],i=[];t(n,function(n,r){r=u(n),a.push(r),r||i.push(n)}),r(i)<r(o)&&(o=i,e=a)}),r(u(o,function(n){return n==o[0]}))==r(o)?e:[]}function v(n){if("TABLE"==n.nodeName){for(var a=function(r){var e,o,u=[],a=[];return function n(r,e){e(r),t(r.childNodes,function(r){n(r,e)})}(n,function(n){"TR"==(o=n.nodeName)?(e=[],u.push(e),a.push(n)):"TD"!=o&&"TH"!=o||e.push(n)}),[u,a]}(),i=a[0],s=a[1],c=r(i),f=c>1&&r(i[0])<r(i[1])?1:0,v=f+1,p=i[f],h=r(p),l=[],g=[],N=[],m=v;m<c;++m){for(var T=0;T<h;++T){r(g)<h&&g.push([]);var C=i[m][T],L=C.textContent||C.innerText||"";g[T].push(L.trim())}N.push(m-v)}t(p,function(n,t){l[t]=0;var a=n.classList;a.add("tg-sort-header"),n.addEventListener("click",function(){var n=l[t];!function(){for(var n=0;n<h;++n){var r=p[n].classList;r.remove("tg-sort-asc"),r.remove("tg-sort-desc"),l[n]=0}}(),(n=1==n?-1:+!n)&&a.add(n>0?"tg-sort-asc":"tg-sort-desc"),l[t]=n;var i,f=g[t],m=function(r,t){return n*f[r].localeCompare(f[t])||n*(r-t)},T=function(n){var t=d(n);if(!r(t)){var u=o(n),a=o(n.map(e));t=d(n.map(function(n){return n.substring(u,r(n)-a)}))}return t}(f);(r(T)||r(T=r(u(i=f.map(Date.parse),isNaN))?[]:i))&&(m=function(r,t){var e=T[r],o=T[t],u=isNaN(e),a=isNaN(o);return u&&a?0:u?-n:a?n:e>o?n:e<o?-n:n*(r-t)});var C,L=N.slice();L.sort(m);for(var E=v;E<c;++E)(C=s[E].parentNode).removeChild(s[E]);for(E=v;E<c;++E)C.appendChild(s[v+L[E-v]])})})}}n.addEventListener("DOMContentLoaded",function(){for(var t=n.getElementsByClassName("tg"),e=0;e<r(t);++e)try{v(t[e])}catch(n){}})}(document)</script>

Post count: 35449

Hi,

Is look that the css is not applied because is not set write, the works are connected between theme and this is not good, this should look like this -> https://i.imgur.com/e4qtYEb.png so in order to work properly, you need to set the css code and js code in theme panel> custom code> this code will be set in css
.tg {border-collapse:collapse;border-spacing:0;border-color:#bbb;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#bbb;color:#594F4F;background-color:#E0FFEB;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:#bbb;color:#493F3F;background-color:#9DE0AD;}
.tg .tg-c3ow{border-color:inherit;text-align:center;vertical-align:top}
.tg .tg-4qqe{font-weight:bold;font-size:22px;border-color:inherit;text-align:center;vertical-align:top}
.tg .tg-7jts{font-size:18px;border-color:inherit;text-align:center;vertical-align:top}
.tg-sort-header::-moz-selection{background:0 0}.tg-sort-header::selection{background:0 0}.tg-sort-header{cursor:pointer}.tg-sort-header:after{content:'';float:right;margin-top:7px;border-width:0 5px 5px;border-style:solid;border-color:#404040 transparent;visibility:hidden}.tg-sort-header:hover:after{visibility:visible}.tg-sort-asc:after,.tg-sort-asc:hover:after,.tg-sort-desc:after{visibility:visible;opacity:.4}.tg-sort-desc:after{border-bottom:none;border-width:5px 5px 0}

-> https://i.imgur.com/uKTfHei.png

this code will be set in custom javascript

var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&e.push(n)}),e}var a=parseFloat;function i(n,r){return function(t){var e="";return t.replace(n,function(n,t,o){return e=t.replace(r,"")+"."+(o||"").substring(1)}),a(e)}}var s=i(/^(?:\s*)([+-]?(?:\d+)(?:,\d{3})*)(\.\d*)?$/g,/,/g),c=i(/^(?:\s*)([+-]?(?:\d+)(?:\.\d{3})*)(,\d*)?$/g,/\./g);function f(n){var t=a(n);return!isNaN(t)&&r(""+t)+1>=r(n)?t:NaN}function d(n){var e=[],o=n;return t([f,s,c],function(u){var a=[],i=[];t(n,function(n,r){r=u(n),a.push(r),r||i.push(n)}),r(i)<r(o)&&(o=i,e=a)}),r(u(o,function(n){return n==o[0]}))==r(o)?e:[]}function v(n){if("TABLE"==n.nodeName){for(var a=function(r){var e,o,u=[],a=[];return function n(r,e){e(r),t(r.childNodes,function(r){n(r,e)})}(n,function(n){"TR"==(o=n.nodeName)?(e=[],u.push(e),a.push(n)):"TD"!=o&&"TH"!=o||e.push(n)}),[u,a]}(),i=a[0],s=a[1],c=r(i),f=c>1&&r(i[0])<r(i[1])?1:0,v=f+1,p=i[f],h=r(p),l=[],g=[],N=[],m=v;m<c;++m){for(var T=0;T<h;++T){r(g)<h&&g.push([]);var C=i[m][T],L=C.textContent||C.innerText||"";g[T].push(L.trim())}N.push(m-v)}t(p,function(n,t){l[t]=0;var a=n.classList;a.add("tg-sort-header"),n.addEventListener("click",function(){var n=l[t];!function(){for(var n=0;n<h;++n){var r=p[n].classList;r.remove("tg-sort-asc"),r.remove("tg-sort-desc"),l[n]=0}}(),(n=1==n?-1:+!n)&&a.add(n>0?"tg-sort-asc":"tg-sort-desc"),l[t]=n;var i,f=g[t],m=function(r,t){return n*f[r].localeCompare(f[t])||n*(r-t)},T=function(n){var t=d(n);if(!r(t)){var u=o(n),a=o(n.map(e));t=d(n.map(function(n){return n.substring(u,r(n)-a)}))}return t}(f);(r(T)||r(T=r(u(i=f.map(Date.parse),isNaN))?[]:i))&&(m=function(r,t){var e=T[r],o=T[t],u=isNaN(e),a=isNaN(o);return u&&a?0:u?-n:a?n:e>o?n:e<o?-n:n*(r-t)});var C,L=N.slice();L.sort(m);for(var E=v;E<c;++E)(C=s[E].parentNode).removeChild(s[E]);for(E=v;E<c;++E)C.appendChild(s[v+L[E-v]])})})}}n.addEventListener("DOMContentLoaded",function(){for(var t=n.getElementsByClassName("tg"),e=0;e<r(t);++e)try{v(t[e])}catch(n){}})}(document)
-> https://i.imgur.com/rOUKtOt.png

and this code will be set in the post content in code editor

<table id="tg-WD84p" class="tg">
<tbody>
<tr>
<th class="tg-4qqe" colspan="4"> Total Vacancy Details</th>
</tr>
<tr>
<td class="tg-7jts" colspan="4"> Graduate Executive Trainee
NEW JOB NOTIFICATION</td>
</tr>
<tr>
<td class="tg-c3ow"> S.No</td>
<td class="tg-c3ow"> Post name</td>
<td class="tg-c3ow"> Number of Post</td>
<td class="tg-c3ow"> Qualification</td>
</tr>
<tr>
<td class="tg-c3ow"> 1</td>
<td class="tg-c3ow"> Mechanical</td>
<td class="tg-c3ow"> 125</td>
<td class="tg-c3ow"> Bachelor Degree (Mechanical
Engg)</td>
</tr>
<tr>
<td class="tg-c3ow"> 2</td>
<td class="tg-c3ow"> Electrical (EEE)</td>
<td class="tg-c3ow"> 65</td>
<td class="tg-c3ow"> Bachelor Degree (Electrical
Engg)</td>
</tr>
<tr>
<td class="tg-c3ow"> 3</td>
<td class="tg-c3ow"> Electrical (ECE)</td>
<td class="tg-c3ow"> 10</td>
<td class="tg-c3ow"> Bachelor Degree (Electronics
& Communication Engg)</td>
</tr>
<tr>
<td class="tg-c3ow"> 4</td>
<td class="tg-c3ow"> Civil</td>
<td class="tg-c3ow"> 5</td>
<td class="tg-c3ow"> Bachelor Degree (Civil Engg)</td>
</tr>
<tr>
<td class="tg-c3ow"> 5</td>
<td class="tg-c3ow"> Control &
Instrumentation</td>
<td class="tg-c3ow"> 15</td>
<td class="tg-c3ow"> Bachelor Degree
(Instrumentation &</td>
</tr>
<tr>
<td class="tg-c3ow"> 6</td>
<td class="tg-c3ow"> Computer</td>
<td class="tg-c3ow"> 5</td>
<td class="tg-c3ow"> Bachelor Degree (Computer
Science/ Computer Engg/ Information Technology)/ PG Degree (Computer)</td>
</tr>
<tr>
<td class="tg-c3ow"> 7</td>
<td class="tg-c3ow"> Mining</td>
<td class="tg-c3ow"> 5</td>
<td class="tg-c3ow"> Bachelor Degree (Mining
Engineering)</td>
</tr>
<tr>
<td class="tg-c3ow"> 8</td>
<td class="tg-c3ow"> Geology</td>
<td class="tg-c3ow"> 5</td>
<td class="tg-c3ow"> M.Tech/ M.Sc (Geology)</td>
</tr>
<tr>
<td class="tg-c3ow"> 9</td>
<td class="tg-c3ow"> Finance</td>
<td class="tg-c3ow"> 14</td>
<td class="tg-c3ow"> CA/ CMA/ Degree (Any
Discipline)</td>
</tr>
<tr>
<td class="tg-c3ow"> 10</td>
<td class="tg-c3ow"> Human Resource</td>
<td class="tg-c3ow"> 10</td>
<td class="tg-c3ow"> Degree (Any Discipline), PG
Degree/ Diploma (Relevant Discipline)</td>
</tr>
</tbody>
</table>

-> https://i.imgur.com/JE2jQlG.png

Hope this will work better now!
Thank you!

Viewing 12 posts - 1 through 12 (of 12 total)
The forum ‘Newspaper’ is closed to new topics and replies.