frontend table challenge
hey guys, simple but imo hard challenge:
how to build this kind of layout ONLY with table/tr/td
no position property
no flexbox, no grid
also: treat both containers as if they could be an image. it is not possible to cut things out.
any ideas?
7 Replies
that sounds like a terrible idea tbh. But if you have to, cut it into as many slices as you need. there's 4 unique combinations of background and image for rows, and four for columns
its for email templates
thats the issue
I messed around with nested tables, the biggest square should be an image
for an email, I'd probably just generate a single image and use that
I can maybe rowspan the big square and then put the rest together
easier to script generating a stacked image than to make that work properly in an email client
Ok I think I got it, but now there is a td-element's height of 404px, but the img inside is only 400px high.
the left side's td's are 202px high as well, but I set them to 200px. the merged cells probably scale with them?
image had to be display: block wow