Open willtcarey opened 7 years ago
I have a similar problem
"border-left-style" => { :value => "solid" },
"border-width" => { :value => "1px"}
gets transformed into
"border-left-style" => { :value => "solid" },
"border" => { :value => "1px"}
But border
and border-width
aren't the same thing, as border rewrites width, style and color
So in this case it's overwriting border-left-style
(= we get no border while we should have one on the left)
So my suggestion would be when creating border shorthands to first check if there are any individual side border styles set and if so bail out. An alternate way to fix this would be to ensure that the border-bottom-width and border-bottom-style styles are set after the border shorthand so they override the shorthand properties but I don't know if there's a good way to do that.
We didn't have this issue in premailer 1.8.7 because the properties were sorted afterwards by name (which puts border
before border-*
) but this was removed in https://github.com/premailer/premailer/commit/d135e0bf040888aba3ac67d83a901d0ce58bfd92
Could be added back in Declarations#to_s
to make sure specific css properties are set after more global properties, but if it was removed somewhere it's not to be added back elsewhere I suppose. It's probably also an easier fix than check the presence of individual side border property though :)
PR welcome, even if it's just a test that reproduces it 👍
My client bought an email template that I'm trying to inline into our emails using premailer. The template has the following css in it
After going through the
expand_shorthand
phase the declarations have properties likeThen it goes through the
create_shorthands
phase and when it runscreate_dimensions_shorthand!
all the border-color declarations are collapsed back into one property which is still correct.The problem occurs at the next phase when it runs
create_border_shorthand!
. It runs through the declarations checking for border-width border-style and border-color. And I do have a border color declaration so it picks that up and creates a shorthand out of it forborder: #dfdfdf
which then overrides theborder-bottom-width
andborder-bottom-style
declarations.So my suggestion would be when creating
border
shorthands to first check if there are any individual side border styles set and if so bail out. An alternate way to fix this would be to ensure that theborder-bottom-width
andborder-bottom-style
styles are set after the border shorthand so they override the shorthand properties but I don't know if there's a good way to do that.Do you have any thoughts?