Unable to clear cached version

Hi Rbkhrlstn,

about DK PDF getting the data, templates/dkpdf-index.php uses the_content() WordPress function.

about table I just created a post with your table code:
https://wp.dinamiko.com/demos/dkpdf/test-table/
https://wp.dinamiko.com/demos/dkpdf/test-table/?pdf=2125
the above example uses my theme CSS styles (grey border in the table…)

maybe you can try to adjust the CSS via DK PDF CSS Settings tab.

Thanks,
Emili

• This reply was modified 7 years, 11 months ago by dinamiko.

Hi Emil,
Thanks for getting back to me.

Thanks,
Rebekah

• This reply was modified 7 years, 11 months ago by Rbkhrlstn.

If I recreate all of the pages, it does clear the cache. Not really convenient but…I have added all of my css in the PDK CSS Settings Tab and it ignores most things having to do with image width/height, td border width/padding, text-align:center, margins set to auto, etc. It’s using browser specific table styles even though they are declared differently in the PDK CSS Settings Tab. Does padding need to be declared using em or px or something else? This has been the most frustrating aspect of my entire project and I have spent more time trying to style this PDF then building all of the forms and tables in the site.

Here is some of my CSS:
h2, h3, h1, p, body {font-family:”open sans”, sans-serif; font-weight:500; color:#333;}
h1 {font-size:26px;}
h2 {font-size:22px; padding-bottom:0; margin-bottom: 0; text-decoration: underline;}
h3,th {font-size:20px;}
tr td {font-size: 18px;}
p, p strong {font-size:14px;}
table {width:1020px; height:auto; border:0;}
table th {text-align:left;}
header {display:none;}
table.invisible,.invisible tr td,.shady tr, table.shady {border-color:#ffffff; font-size:20px;}
table.invisible h2 {font-size:24px;}
tr td {height:auto;}
table {border:1px solid #d5d5d5;}
tr td, tr th {border-top:1px solid #d5d5d5;}
.big-table tr th, .big-table tr td {padding: 0.5em 0.2em;}
.backto {display:none;}
td, tr, th {width:auto; margin: auto; display: block;}
.shady h2 {text-decoration:underline;margin-bottom:15px;}
.shady td, .no-space td { padding: 4px 10px 4px 15px; margin: 10px; border-color: #eeeeee;}
.shady tr {padding:25px;}
table.shady {background:#eeeeee; padding:25px;}
.single-photo img, .three-photos img, .stacked img {margin: 0 auto; display: block;}
.four-side-by-side img, .side-by-side img { margin-top: 50px; width:100px;height: auto; display:block; margin-left:auto; margin-right:auto;}
td p {font-size: 24px;}
.aligncenter { text-align: center; margin-left:auto; margin-right:auto;}
.side-by-side td img{padding-left:20px; padding-right:20px; max-width:250px; max-height:300px; overflow:hidden;}

Hi Rbkhrlstn, sorry for the delay,

you can add padding in pixels.
try to add !important at the end, for example:

table {border:1px solid #d5d5d5 !important;}

I’m curious about how are you creating the tables, are you using a shortcode (via some plugin)? or are you adding the HTML markup directly in WordPress editor?

Thanks,
Emili

Hi Emili,
I’m using Formidable Forms in their “Views” to output the data. It uses the WordPress text editor. I’m building the table in Sublime Text 2 and then copy and pasting them into the text view of the WP editor. When it is on the page (in browser), it looks perfect but when it goes to the pdf, the styling is a mess. I tried incorporating the theme CSS via the headers option in the CSS tab and that didn’t work at all so I had to rebuild the styles for the pdf in the plugin css field. Every time a put an !important, your built in text editor seems to not like it. I guess I need to ignore the warning.

Hi Rbkhrlstn,

maybe it’s a problem with the PDF library, or maybe other css styles are applying to the table, I don’t know for sure…

another option could be not using tables but divs instead, something like this:

<div float:left; style="width: 100%;">
  <div style="width: 48%; float: left;">
    <img style="margin-top:15px;width:100%;height:auto;" src="https://avaluos.staging.wpengine.com/wp-content/uploads/formidable/13/newyear-2.jpg" />
  </div>
  <div style="width: 48%; float: right;">
    <img style="width:100%;height:auto;" src="https://avaluos.staging.wpengine.com/wp-content/uploads/formidable/13/shuffle-1.jpg" />
  </div>
  <div style="margin-top:20px;float:left;width:100%;text-align:center;">VIA DE ACCESO A LA PROPIEDAD</div>
</div>

I just did a test here: https://wp.dinamiko.com/demos/dkpdf/test-table/

Thanks,
Emili

Thanks Emili,
I tried divs first and the pdf ignored the floats. Trust me, if I didn’t have to build tables I wouldn’t have. The PDF also ignored all of my inline styles when I tried that instead of the stylesheet. I’m using Divi and perhaps the js is causing issues.