frontend icon indicating copy to clipboard operation
frontend copied to clipboard

Markdown Card shows table borders in 2025.12 where it didn't in 2025.11

Open Recte opened this issue 3 weeks ago • 39 comments

Checklist

  • [x] I have updated to the latest available Home Assistant version.
  • [x] I have cleared the cache of my browser.
  • [x] I have tried a different browser to see if it is related to my browser.
  • [ ] I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.

Describe the issue you are experiencing

In Firefox, Brave and on iOS borders of a table are shown, where they where not in the past.

Image

Code that did not show borders in 2025.11:

<Table align=center width=100%>
<TR><TD colspan="4"><ha-icon icon="mdi:wifi-lock"></ha-icon> Guest WiFi</TD></TR>
<TR><TD width=50></TD><TH width="70">Network</TH><TH width="100">Username</TH><TH width="100">Password</TH></TR>
<TR><TD></TD><TD Align=center>MyWiFi</TD><TD Align=center>Guest</TD><TD Align=center>GuestPassword</TD></TR></table><br>

Tried using code to make borders invisible in 2025.12:

<Table align=center width=100% style="border: none;">
<TR style="border: none;"><TD colspan="4"><ha-icon icon="mdi:wifi-lock"></ha-icon> Guest WiFi</TD></TR>
<TR style="border: none;"><TD width=50></TD><TH width="70">Network</TH><TH width="100">Username</TH><TH width="100">Password</TH></TR>
<TR style="border: none;"><TD></TD><TD Align=center>MyWiFi</TD><TD Align=center>Guest</TD><TD Align=center>GuestPassword</TD></TR></table><br>

and

<Table align=center width=100% border=0>
<TR border=0><TD colspan="4"><ha-icon icon="mdi:wifi-lock"></ha-icon> Guest WiFi</TD></TR>
<TR border=0><TD width=50></TD><TH width="70">Network</TH><TH width="100">Username</TH><TH width="100">Password</TH></TR>
<TR border=0><TD></TD><TD Align=center>MyWiFi</TD><TD Align=center>Guest</TD><TD Align=center>GuestPassword</TD></TR></table><br>

Describe the behavior you expected

The expected behavior is that the table is displayed like in the example above, but without the borders.

Steps to reproduce the issue

  1. Past the code in a markdown card

What version of Home Assistant Core has the issue?

2025.12.0

What was the last working version of Home Assistant Core?

2025.11.1

In which browser are you experiencing the issue?

Firefox 140.5.0esr (64-bit), Brave v1.85.111

Which operating system are you using to run this browser?

Debian 13

State of relevant entities


Problem-relevant frontend configuration


JavaScript errors shown in your browser console/inspector


Additional information

No response

Recte avatar Dec 04 '25 11:12 Recte

This is a feature, not a bug. Tables should have borders

MindFreeze avatar Dec 04 '25 11:12 MindFreeze

I disagree that tables should have borders, they are often used to align data. Borders are only used to add clarity when needed, borders around every cell creates clutter and can make for a complex UX.

Best UX practice for table borders is to use them minimally.

In addition, cell padding was added to th and td cells which cannot be changed with custom themes. Again, this can be create a bad UX. It worked just fine before and gave a good look and feel, it now looks busy and creates tables that can be difficult to read. A bad UX experience can be raised as an issue.

irata-coder avatar Dec 04 '25 12:12 irata-coder

This is a feature, not a bug. Tables should have borders

That's one opinion. It is changed and not listed in the release notes, so based on my info it is a bug. For as far as I know/can find, there is no feature request either. If that's correct, it's an issue according to my definition list. If there is a request, I wonder whether ignoring style settings/syntax was a conscious choice/scenario that was taken into account.

Anyway, it's not my product.

Recte avatar Dec 04 '25 12:12 Recte

If my memory serves me correctly, the initial change to the Markdown Card was to facilitate the response from an ASSIST query, requiring many changes to the original card. It was never tested properly and now users of the original card are left with a total mess to resolve.

Kertz1954 avatar Dec 04 '25 14:12 Kertz1954

Setting markdown-table-border-width: 0px in a theme has been advertised elsewhere as a way to hide the borders.

karwosts avatar Dec 04 '25 16:12 karwosts

Unfortunately markdown-table-border-width does not remove the 0.25em padding that has been added. in ha-markdown.ts

td, th { border-width: var(--markdown-table-border-width, 1px); border-style: var(--markdown-table-border-style, solid); border-color: var(--markdown-table-border-color, var(--divider-color)); padding: 0.25em 0.5em; }

This padding means that tables that were carefully crafted to use the maximum width available, now no longer fit and wrap. I would argue this, for some, was a breaking change.

irata-coder avatar Dec 04 '25 17:12 irata-coder

Just updated and ran into this bug... PLEASE fix

Ltek avatar Dec 04 '25 18:12 Ltek

I temporarily solved the problem by converting my Markdown card to custom:html-template-card (found and installed by HACS). The code remains the same (it's just a matter of changing the first line of the card from "type: markdown" to "type: custom:html-template-card"), and I also have greater control over the HTML code, including the styling of each individual element (just like a good old-fashioned HTML page).

What I lose is the minimal visual editor for the Markdown card and sometimes I have to write HTML code in a single line, without line breaks and without indentation..... but I can live with this limitation.

giobuc avatar Dec 05 '25 07:12 giobuc

I temporarily solved the problem by converting my Markdown card to custom:html-template-card (found and installed by HACS). The code remains the same (it's just a matter of changing the first line of the card from "type: markdown" to "type: custom:html-template-card"), and I also have greater control over the HTML code, including the styling of each individual element (just like a good old-fashioned HTML page).

What I lose is the minimal visual editor for the Markdown card and sometimes I have to write HTML code in a single line, without line breaks and without indentation..... but I can live with this limitation.

hard to find... "Lovelace HTML Jinja2 Template card" in HACS loads custom:html-template-card

but it did not fix any of mine, it does not let anything render at all now.

Ltek avatar Dec 05 '25 21:12 Ltek

Using that "type: markdown" to "type: custom:html-template-card" fixes the problem but left a lot of space to the top of my card used in the dashboard

Image

lordwizzard avatar Dec 05 '25 22:12 lordwizzard

Just updated the Home Assistant to 2025.12.1 and it is working almost like before but still has border outlines.

Image

Will try suppressing borders as mentioned above

lordwizzard avatar Dec 05 '25 23:12 lordwizzard

Also seeing this error:

`Logger: homeassistant.helpers.event Source: helpers/template/init.py:463 First occurred: 6:09:01 PM (16 occurrences) Last logged: 6:09:02 PM

Error while processing template: Template<template=(

{% set pollen = state_attr('sensor.kleenex_pollen_radar_kish_home_weeds','details') %}{% for weed in pollen %} {% endfor %}
Weeds Value Level
{{ weed.name }} {{ weed.value }} {{ weed.level }}
) renders=40> Error while processing template: Template<template=({% set pollen = state_attr('sensor.kleenex_pollen_radar_kish_home_weeds','details') %}{% for weed in pollen %} {% endfor %}
Weeds Value Level
{{ weed.name }} {{ weed.value }} {{ weed.level }}
) renders=42> Error while processing template: Template<template=({% set pollen = state_attr('sensor.kleenex_pollen_radar_kish_home_weeds','details') %}{% for weed in pollen %} {% endfor %}
Weeds Value Level
{{ weed.name }} {{ weed.value }} {{ weed.level }}
) renders=44> Error while processing template: Template<template=({% set pollen = state_attr('sensor.kleenex_pollen_radar_kish_home_weeds','details') %}{% for weed in pollen %} {% endfor %}
Weeds Value Level
{{ weed.name }} {{ weed.value }} {{ weed.level }}
) renders=46> Error while processing template: Template<template=({% set pollen = state_attr('sensor.kleenex_pollen_radar_kish_home_weeds','details') %}{% for weed in pollen %} {% endfor %}
Weeds Value Level
{{ weed.name }} {{ weed.value }} {{ weed.level }}
) renders=48> Traceback (most recent call last): File "/usr/src/homeassistant/homeassistant/helpers/template/init.py", line 461, in async_render render_result = render_with_context(self.template, compiled, **kwargs) File "/usr/src/homeassistant/homeassistant/helpers/template/context.py", line 45, in render_with_context return template.render(**kwargs) ~~~~~~~~~~~~~~~^^^^^^^^^^ File "/usr/local/lib/python3.13/site-packages/jinja2/environment.py", line 1295, in render self.environment.handle_exception() ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~^^ File "/usr/local/lib/python3.13/site-packages/jinja2/environment.py", line 942, in handle_exception raise rewrite_traceback_stack(source=source) File "

lordwizzard avatar Dec 05 '25 23:12 lordwizzard

If you use/can add card-mod it'll offer you much tighter control of your default cards.

This was suggested to me and worked to get rid of everything, when tagged to the end of a markdown card - but you can just use border:none if that's the only thing you want to change.

card_mod: style: | ha-card { background: none !important; box-shadow: none !important; border: none !important; padding: 0 !important; margin: 0 !important; }

I-am-Joel avatar Dec 06 '25 00:12 I-am-Joel

It did not change anything, so something is not right

lordwizzard avatar Dec 06 '25 03:12 lordwizzard

Setting markdown-table-border-width: 0px in a theme has been advertised elsewhere as a way to hide the borders.

This works (in 2025.12.1), but doesn't change my view on it being a bug.

Recte avatar Dec 06 '25 04:12 Recte

Exact same bug here since exact same version.

emynicotine avatar Dec 06 '25 07:12 emynicotine

Yeah, this is another "we're going to just change the visuals to annoy long time users" bug that'll never get fixed.

The custom-html-card doesn't work (nothing renders) and the card_mod suggestion doesn't work either - I can't seem to find the right CSS to target the goddamn borders. Thanks again Home Assistant Frontend devs, with your "we change stuff on whims because why not!"

cpw avatar Dec 07 '25 22:12 cpw

Note that changing a style of elements inside Markdown is not a bug. If you do not like styling , you can use card-mod.

ildar170975 avatar Dec 07 '25 22:12 ildar170975

Except that doesn't work. It literally refuses to style the markdown card. There's an explicit td element in the markdown card and it seems impossible to target it with the card-mod styling. The example above doesn't work.

cpw avatar Dec 07 '25 22:12 cpw

Inability (due to either cardmod limitations or user experience) to style a Markdown card by cardmod cannot justify those “this is a bug!” statements. As long as Markdown’s standards are fulfilled, we cannot blame HA.

ildar170975 avatar Dec 07 '25 22:12 ildar170975

So you're arguing that a long standing visual being "corrected" with no alternative is acceptable? I have literally had this card on my dashboard for 7 years. It has always (modulo the occasional templating bug) looked the same, and GOOD. Now, it looks like, well, rubbish. It appears the only way to make it look good again is by reverting to 2025.11. That does seem pretty bug like to me. Sure it's not "the thing is crashing" broken, but I'll be reverting to 2025.11 and I guess never updating again?

cpw avatar Dec 07 '25 22:12 cpw

Please do not attribute me thoughts I did not express. The fact is Frontend can be changed in part of styles (like “default icons became bigger”) and I am not saying that this is good or bad. Suggest you to invest more time in card-mod tests, also you can ask in HA community.

ildar170975 avatar Dec 07 '25 23:12 ildar170975

OK. I spent some more time, and this actually works, with ha card-mod:

card_mod:
    style: |
      ha-card
      {
      --markdown-table-border-style: none;
      }

cpw avatar Dec 07 '25 23:12 cpw

You mean with card-mod 4. Have you tried with cardmod 3.x? Guess it will work without that prepand thing. Probably this is why your previous attempts failed.

ildar170975 avatar Dec 07 '25 23:12 ildar170975

The prepend is not necessary - that's a leftover of a previous attempt. I have updated my example. Also, yes, that's card-mod 4 - the one currently available in HACS.

cpw avatar Dec 07 '25 23:12 cpw

Also, yes, that's card-mod 4 - the one currently available in HACS.

All versions are available in HACS, including “classic” 3.4.6. I asked you about 3.x since some old code do not work in 4.0 and needs alterations.

Anyway, good that you sorted things out!

ildar170975 avatar Dec 07 '25 23:12 ildar170975

OK. I spent some more time, and this actually works, with ha card-mod:

card_mod:
    style: |
      ha-card
      {
      --markdown-table-border-style: none;
      }

It completely fixed my problem also. Thank you

Edit using card-mod 4.1.0 - beta (4 or 5)

lordwizzard avatar Dec 08 '25 01:12 lordwizzard

Let’s hope that this issue will be closed then.

ildar170975 avatar Dec 08 '25 01:12 ildar170975

Let’s hope that this issue will be closed then.

The bug is not fixed... A workaround does not negate the fact the bug was introduced in 2025.12.0

I have a dozen cards this affects, and by the looks of it there are many people this bug has hit. As they say in tech, for everyone 1 person that speaks up, there are 100 with the same issue that did not.

Ltek avatar Dec 08 '25 01:12 Ltek

Not a bug as was stated several times.

ildar170975 avatar Dec 08 '25 11:12 ildar170975