Cannot remove table borders on a Wordpress site

Question

It works if I put the code into a blank HTML file on my desktop, but not on the Website. I have always had trouble removing table borders from Wordpress Websites. This is the code that I have so far:

HTML

  <table border="0" cellspacing="0" cellpadding="0">
   <td>
      <a href="http://graysonforeman.com/portfolio/websites/">
      <img src="http://graysonforeman.com/wp-content/uploads/2016/03/mrs.jpg" height="175"     width="175"></a>
   <td><a href=" http://graysonforeman.com/portfolio/writing/">
      <img src="http://graysonforeman.com/wp-content/uploads/2016/03/pen_paper_2-512.png" height="175" width="175"></a>
   </td>
   <td><a href="http://graysonforeman.com/portfolio/programming/">
      <img src="http://graysonforeman.com/wp-content/uploads/2016/03/Java.png" height="175" width="175"></a>
   </td>
   </tr>
   <tr>
      <td>Websites</td>
      <td>Writing</td>
      <td>Programming</td>
</table>

I thought about editing the style sheet, but I do not want to mess up the rest of my theme. Thank you for any help.

score 1 · Answer 1 · edited May 23 '17 at 12:23

1

Try using the !important attribute to the style, something like this:

<table style="border: 0 !important;" cellspacing="0" cellpadding="0">

The !important rule is a way to make your CSS cascade but also have the rules you feel are most crucial always be applied. A rule that has the !important property will always be applied no matter where that rule appears in the CSS document.

See further details here : What does !important in CSS mean?

edited May 23 '17 at 12:23

Community

1
1

answered Mar 29 '16 at 02:10

Ash

2,575
2
19
27

Thank you for your response, but unfortunately it did not work. – Greysus Mar 29 '16 at 02:36
You may also have borders on your `td`s. Can you give us a link? – trex005 Mar 29 '16 at 02:38

score 1 · Accepted Answer · answered Mar 29 '16 at 02:43

Try clearing the border on your table and tds

<style type='text/css'>
table.no_border, table.no_border td{
border:0 !important;
}
</style>
<table border="0" cellspacing="0" cellpadding="0" class='no_border'>
   <tr>
      <td>
         <a href="http://graysonforeman.com/portfolio/websites/">
            <img src="http://graysonforeman.com/wp-content/uploads/2016/03/mrs.jpg" height="175"     width="175">
         </a>
      </td>
      <td>
         <a href=" http://graysonforeman.com/portfolio/writing/">
            <img src="http://graysonforeman.com/wp-content/uploads/2016/03/pen_paper_2-512.png" height="175" width="175">
         </a>
      </td>
      <td>
         <a href="http://graysonforeman.com/portfolio/programming/">
            <img src="http://graysonforeman.com/wp-content/uploads/2016/03/Java.png" height="175" width="175">
         </a>
      </td>
   </tr>
   <tr>
      <td>Websites</td>
      <td>Writing</td>
      <td>Programming</td>
   </tr>
</table>

I also fixed your trs and one td

Thank you so much! I wish that I would have thought of that before. I also had to add a tr to the CSS, because I had one line under the table where I put labels. Thank you. — Greysus, Mar 29 '16 at 02:57

score 0 · Answer 3 · answered Mar 29 '16 at 02:55

You can use !important to override the rest. That is the highest priority order.

   <table border="0 ! important" cellspacing="0" cellpadding="0"       class="no_border">

to override another css priority . I have a video for this https://youtu.be/NqDb9GfMXuo

Cannot remove table borders on a Wordpress site

3 Answers3