Problem With CSS

234 views
Skip to first unread message

Tze Jet

unread,
Apr 3, 2021, 9:39:42 AM4/3/21
to Google Apps Script Community
Hi all, I am quite new to google apps script. I was wondering why the borders of my table would not show up? I have already implemented it . This is my code:


WhatsApp Image 2021-04-03 at 21.37.54.jpegWhatsApp Image 2021-04-03 at 21.37.33.jpeg

Alan Wells

unread,
Apr 3, 2021, 10:11:06 AM4/3/21
to Google Apps Script Community
remove
style =

Should be:
table {border: 

https://www.w3schools.com/css/css_table.asp

Tze Jet

unread,
Apr 3, 2021, 11:37:18 PM4/3/21
to Google Apps Script Community
WhatsApp Image 2021-04-04 at 11.36.28.jpeg
I have fixed the style tag problem. However, it is still not showing borders. What could be the reason?

Alan Wells

unread,
Apr 4, 2021, 9:30:20 AM4/4/21
to Google Apps Script Community
GmailApp does not support HTML with <style> tags.
All the CSS styling must be "inline."
Remove the <style> tag.
Add the style attribute to the table tag:
<table style="border:1px solid black;border-collapse:collapse;">

Clark Lind

unread,
Apr 4, 2021, 9:38:35 AM4/4/21
to Google Apps Script Community
AJ, you keep beating me to the answer lol 

I'm guessing that it is now an email issue. It probably works just fine if you served it in a browser, but email html is different.

AJ's code probably works, if not, you may have to get really specific like:
<table style="border-width:1px;border-style:solid;border-color:black;border-collapse:collapse;">

Here is the reference info.

Tze Jet

unread,
Apr 5, 2021, 5:40:55 AM4/5/21
to Google Apps Script Community
However, this time it is not showing the html properly... what could be the reason?WhatsApp Image 2021-04-05 at 17.40.32.jpeg
WhatsApp Image 2021-04-05 at 17.38.58.jpeg

Enrique Suárez

unread,
Apr 5, 2021, 8:06:25 AM4/5/21
to Google Apps Script Community
seems the quotes are not closed in the line <table style="border:1px solid black;border-collapse:collapse;">
add " right before > , try and let us know.

Tze Jet

unread,
Apr 7, 2021, 8:06:52 AM4/7/21
to Google Apps Script Community
Thank you, that seemed to have fixed the issue.

However, I would prefer that there is a line for each row for the borders... But it is now showing only on the outside.

What can I do to fix it? WhatsApp Image 2021-04-07 at 20.06.35.jpeg

Clark Lind

unread,
Apr 7, 2021, 8:57:14 AM4/7/21
to google-apps-sc...@googlegroups.com
You can experiment and add the same style tag inside the opening <tr> tag like this :  <tr style="border:etc ... " >   and you may also need to add it to the <td> tag too.

--
You received this message because you are subscribed to a topic in the Google Groups "Google Apps Script Community" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-apps-script-community/CHrp4gPed-M/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-apps-script-c...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-apps-script-community/4ed60b70-e580-4b2b-a82b-bb822bc19677n%40googlegroups.com.
Reply all
Reply to author
Forward
0 new messages