MPDF57 CSS3 list-style:none not being applied (or isn't supported) for <UL> items inside <TD> element

StackOverflow https://stackoverflow.com/questions/23257120

  •  08-07-2023
  •  | 
  •  

Question

I would like to clear list-style-type:circle; from the generated PDF (using MPDF57). I've read the CSS3 Docs (and according to the documentation, list-style:none; is supported), but during the Output() stage of creating a PDF file, the circle can seen.

HTML OUTPUT HTML RENDER
(source: iforce.co.nz)

Border is to only emphasize, which elements are being targeted.

PDF OUTPUT PDF FILE
(source: iforce.co.nz)

CSS (HTML available via PasteBin).

.schedule_logo_con img {
    width: 300px;
    height: auto;
}
.daily_schedule { font-family: helvetica, sans serif }
.schedule {
    font-family: helvetica, sans serif;
    margin: 0px !important;
    padding-bottom: 10px;
}
.schedule_list { margin: 10px 0 0 0 }
ul {
    margin: 0;
    padding: 0;
}
.weekday {
    width: 65px;
    text-align: center;
    border-left: solid #ddd 1px;
    color: red;
}
.weekday ul li {
    border: 1px solid red;
}
ul, .weekday ul, .weekday ul li {
    list-style-type: none;
}

I've also tried list-style-type:none; (In addition too checking MPDF56 to see whether it is something with MPDF57), but regardless this style is not being applied.

Was it helpful?

Solution

For now, it seems to be a rendition problem, from the library itself

<UL> with no parents

But, the above CSS does work, if the UL element is being generated on its own, and not as a child of a another element.

<ul>
<li>Test A</li>
<li>Test B</li>
</ul>

PDF OUTPUT

PDF NO CHILDREN
(source: iforce.co.nz)

Solution

Therefore, the designer and I have a found a work around, using divs and replicating a list with display:block;, although if someone is able to figure out a solution for <UL>, without high server load (That would be great too).

CSS

div.weekday_time {
    display:block;
}

HTML

<div class='weekday_time'>
    10:30 PM
</div>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top