Comments (7)
@acomito did you figure anything out here? i just ran into the same situation!
from react-html-email.
@acomito I get these but they are warnings. Email is getting delivered fine.
Warning: Unknown props bgcolor
, border
, align
, valign
on
W20161207-21:56:02.102(-8)? (STDERR) in table (created by Box)
W20161207-21:56:02.102(-8)? (STDERR) in Box (created by Email)
W20161207-21:56:02.103(-8)? (STDERR) in body (created by Email)
W20161207-21:56:02.104(-8)? (STDERR) in html (created by Email)
from react-html-email.
Don't you have to put the <Box>
inside an <Item>
? The <Item>
is like a <tr><td>
, from the docs).
from react-html-email.
The reason you are getting this is because the <Email />
component renders a <Box />
element. The box renders a table
and then a nested tbody
as it's children. By putting a <Box />
inside the <Email />
you are trying to put a table inside a tbody which is invalid html probably. The <Box />
doesn't need to be used here, it's only if you want another table
somewhere else.
from react-html-email.
@MartinDawson what do you mean by somewhere else
? Do you mean outside <Email />
?
Would that make sens?
from react-html-email.
Update:
I've just been using es6 strings. You can use variables in it. You can easily break them out into component-ish string fragments (you could even make them functions that consume variables.
You can use mailchimps free email builder, then export the html and plop that into a string and go from there.
from react-html-email.
I agree this is very confusing, the docs are a bit unclear. Basically Email
mounts a table and content goes inside tbody
so if you try to put a Box
inside it'll generate invalid markup. Basically only use Box
inside of Item
if you want nested tables, otherwise just use Item
from react-html-email.
Related Issues (20)
- Row & Column components HOT 3
- Warnings log even though warn is set to false HOT 3
- Your kitchenSink.jsx doesn't work, should it? HOT 1
- unsupported props warning even when downgrading to 1.2.0 HOT 2
- Webpack build error HOT 2
- Can't build with webpack 3.10 HOT 2
- react-html-email fails to compile when building HOT 11
- is there a full example HOT 2
- Can I use it for server-side-rendering? HOT 1
- Using a number for width and height doesn't give us responsive images
- Are there tests validating cross-client compatibility? HOT 1
- Setting multiple <style> blocks
- Test with enzyme: mount
- Span component does not inherit className prop HOT 1
- [BUG] Default example kitchenSink.jsx does not display well in default Galaxy S6 email client. HOT 2
- [SOLVED] Layout issue - <Box> won't center HOT 1
- Email shows all the html tags and etc HOT 1
- TypeError: Cannot read property 'getCurrentStack' of undefined HOT 1
- Where do static files end up?
- Can I use react-bootstrap with this package?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-html-email.