Hi,

I'm experiencing a problem with border-radius property in a very simple piece of code.

It should result in rounded squares but they aren't at all.

I cared about having 'border' property before the 'border-radius' property but no success.

This code works fine in Prince 7.1 but not in 8.1 and 9.0.

I've tried to generate files via prince command line 9.0 rev3 and I know the 7.1 is working as I tried on the "Try it out" page of DocRaptor (a service using prince xml).

Could you please have a look?

1. prince-test.html‎ 5.0 kB ‎
   Border-radius not working in Prince 9.0

If you set the border shorthand property, then you need to set border-radius after, not before, or it will be overwritten. Although it seems that browsers handle this differently, maybe they don't reset border-radius for the border shorthand property?

I've tried before and after without result.

I've tried to open in Mac Preview, Google Chrome, Safari.

I've tried to remove border as well.

EDIT: I edited the wrong file. Indeed moving the border property before the border-radius works. Sorry and thank you!

Edited 27 Nov 2013 by le_daf

@mikeday, this is incorrect. The border shorthand property is ONLY for setting border-color, border-style, and border-width, not border-radius. https://developer.mozilla.org/en-US/docs/Web/CSS/border

This especially causes problems if you have user-generated content, and they start generating content in IE, which alphabetizes the style declaration, always putting border-radius before border.

We can probably fix this in post-processing, but this should ultimately be fixed in the Prince rendering engine.

Right, we will change the border shorthand property in the next release of Prince.

Thanks mike!

This is now fixed in the current alpha version.

Not sure if this is related, but the border-radius shorthand property seems not to be working for me also.

Working: border-top-left-radius: 3px;

Not working: border-radius 3px 0 0 0;

Unrelated, but yes we have not supported the latest syntax for the border-radius shorthand property yet, so it is still necessary to use the individual properties for now.

percentage support also seems to not be working:

This works:
#id {
height: .3663in
width: .3663in
border-radius: .18315in
}

But this does not:
#id {
height: .3663in
width: .3663in
border-radius: 50%
}

Percentages values for border-radius properties should be supported in the latest alpha version.