SolidJS•7mo ago

Style attribute not updating in Safari

I wonder if anyone has run into this. I've got a SplitPane component that I just discovered doesn't work in Safari. It turns out the style attribute is not updating. I've got it down to

<div data-foo={`width: ${width()}`} style={`width: ${width()}`}>

<div data-foo={`width: ${width()}`} style={`width: ${width()}`}>

I can see data-foo changing in the element inspector, but style remains unchanged. It's the same with the object version of style

<div data-foo={`width: ${width()}`} style={{width: width()}}}>

<div data-foo={`width: ${width()}`} style={{width: width()}}}>

Any ideas? Thanks : )

2 Replies

bigmistqke•7mo ago

strange, i wouldn't directly know. can u reproduce it in the playground?

mdynnl•7mo ago

width: <number> is invalid css except for 0 (implicitly 0px) and because solid directly uses el.style instead of attribute, invalid properties won't update or show up in attribute to confirm, try this

document.body.style.width = 1

document.body.style.width = 1

document.body.style.cssText = `width:1`

document.body.style.cssText = `width:1`

Gaming

Programming

Style attribute not updating in Safari