i can see the cell padding in the visual editor, but when i publish the page the cell padding/spacing is gone and all the cells are butted up right next to each other.
Hi rehtaeh! I’ve had similar issues working with WordPress and other CMS such as Joomla.
Have you checked out your theme’s css file? For example, even if you have cell padding/spacing set for the <table> tag, you may have some css already set to handle the <tr> and <td> tags which is overriding your cell padding/spacing settings.
thanks for your reply brad 🙂
where do i go to see my theme’s css file? I’m using headway themes 3… i’m not sure where to find this information?
and once there do I then change the settings? if so, what do i change them to to get cell padding and spacing in my tables?
thanking you
Hi rehtaeh. You can view your css file by either:
1. Pulling up your website in a browser and looking for files called in the header that end with css, and then opening them up within your browser
2. Log into your WordPress dashboard, go to “Appaerance” and click “Editor” and then find your css file in the right sidebar
If you’d like, respond back with your domain name, and I’d be happy to take a look at your css files as well.
Thanks Brad 🙂
the url is http://www.consciousmusicmovement.com and the page i’m having trouble with in regards to the table cell padding/spacing is http://www.consciousmusicmovement.com/festival-2012/cm-fest-sponsors
Would be so awesome if you could tell me which part of the css file i need to change to make the table cell padding work 🙂
with thanks
Hello Brad…
wondering if you’ve had some time to check out the table cell padding and spacing issue I’m having?
Cheers!
Hi rehtaeh, sorry for getting back to you so late. With the cell padding issue, I recommend trying the following:
Add the following code to your css file:
table.padded_table1 { border-collapse: collapse; }
table.padded_table1 th { border-width: 1px; padding: 4px; border-style: inset; border-color: gray; }
table.padded_table1 td { border-width: 1px; padding: 4px; border-style: inset; border-color: gray; }
… then, with your table, add a class to it like this:
<table class='padded_table1'>
… That should do the trick. I’ve used a few content management systems in the past that had default table styles that were a bit difficult to find and change, and I found that simply creating a new class and assigning it to my tables was the easiest solution.
