0

I am using pdf2htmlEX tool to convert PDF documents into HTML5 content. The tool works fine, gives me great results. I do have one problem with case-sensitive class names that is applied to a page background image.

pdf2htmlEX generates HTML files for every PDF page along with two CSS files that define page containers and place elements within each page. I use this HTML and CSS in my web app to display this content. Everything works fine except the position of background image in some cases.

The problem is following. Each page background image has one of these two classes applied to it (generated by pdf2htmlEX):

.Bi { /* images that occupies the whole page */
  position:absolute;
  border:0;
  margin:0;
  top:0;
  bottom:0;
  width:100%;
  height:100%;
  -ms-user-select:none;
  -moz-user-select:none;
  -webkit-user-select:none;
  user-select:none;
}
.bi { /* images that cover only a part of the page */
  position:absolute;
  border:0;
  margin:0;
  -ms-user-select:none;
  -moz-user-select:none;
  -webkit-user-select:none;
  user-select:none;
}

When I open the preview HTML page generated by pdf2htmlEX then only ".bi" or ".Bi" style is applied to that background image. You can see that here in Firebug image, which styles are applied:

enter image description here

Same HTML inserted into my app applies both classes to this image, resulting in mis-placement in some cases... See the same HTML and firebug image for styles applied in my weba app:

enter image description here

How is this possible? CSS selectors and class names are case-insensitive right?

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
Primoz Rome
  • 10,379
  • 17
  • 76
  • 108
  • "right?" - no. "All CSS syntax is case-insensitive within the ASCII range (i.e., [a-z] and [A-Z] are equivalent), except for parts that are not under the control of CSS. For example, the case-sensitivity of values of the HTML attributes "id" and "class"" > http://www.w3.org/TR/CSS2/syndata.html -. Simple demo here: http://jsfiddle.net/h9cV3/ – Nico O Jul 22 '14 at 14:14
  • OK thanks for you explanation, but why are in my case both `.Bi` and `.bi` CSS class rules applied to a element with `class="bi"`? – Primoz Rome Jul 23 '14 at 07:14
  • They should not be. Have a look at the fiddle, there is only one style applied. I can not see every node in your pictures and therefore I can not tell what went wrong. Propably .bi is a child of a node with .Bi, but thats hard to tell. Make a demo in which this behaviour can be reproduced or we wont be able to give you more info on your usecase. – Nico O Jul 23 '14 at 09:13

0 Answers0