-
-
Notifications
You must be signed in to change notification settings - Fork 33
Open
Description
I have an email written in Markdown:
Hey!
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged.
{% include "email/partials/button.html" with context %}
[Link]({{ button_url }})
It gets rendered into the following HTML using Jinja and then Python-Markdown:
<p>Hey!</p>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged.</p>
<div>
<a href="https://example.com">
<span style="mso-text-raise: 16px">
Continue reading →
</span>
</a>
</div>
<p><a href="https://example.com">Link</a></p>
Then I wrap it into the <main>
tag for css-inliner to recognize it as a fragment, and then inline the following CSS:
p {
font-size: 16px;
line-height: 24px;
color: #475569;
margin: 0 0 16px;
}
a {
color: #2563eb;
text-decoration: underline;
}
Question: how can I prevent the inliner from touching any elements that are inside of the included button div
without adding data-css-inline="ignore"
to every <a>
and <p>
?
I tried using :has()
and :not()
CSS selectors, but they seem to be ignored:
a:not(*[data-raw] a) {
color: #2563eb;
text-decoration: underline;
}
<div data-raw>
<a href="https://example.com">Continue reading</a>
</div>
Metadata
Metadata
Assignees
Labels
No labels