Three days ago I had no idea what Shopify was.
Then I took a client job.
"Mobile adaptation, match the design." Sure. Took ¥1500 RMB.
What I didn't know: there were multiple pages to adapt. What "match the design" actually meant. What Shopify even was.
Day 1: learned what Shopify is, what Figma is, how to edit CSS in a theme. Actually got some things working. Felt pretty good.
Day 2: started hitting walls. Images cropped wrong. Tables overflowing. JS-injected styles that CSS can't touch.
Day 3: still digging. Some fixed. Some abandoned.
Job's not done. ¥1500 in — every yuan of it tuition.
Worth it?
Absolutely. Because I got paid to learn.
Okay I need help.
¥1500 in. Still not finished.
If anyone has experience with:
Shopify theme CSS overrides
elements with negative margins breaking child width calculations
JS inline styles that !important can't touch
Please. I'm right here.
(yes I know. I know.)
https://tinystrack.com
The JS inline style problem has one reliable fix. Use a MutationObserver to watch for the element and apply your styles after the injection fires. !important wont help you there because the JS runs after your CSS.
For the negative margin breaking child width, check if the parent has overflow hidden set. That kills width calculations on nested elements in weird ways.
And honestly, going from zero Shopify knowledge to debugging theme JS conflicts in 3 days is not small. Most devs avoid Shopify specifically because the theme architecture is messy. You are already past the hard part.
The JS inline styles problem is nasty specifically because Shopify themes inject them after DOM load, meaning your CSS fires before the overrides land. One approach that sometimes works: a MutationObserver watching for the element, then applying your styles reactively after the injection happens. Did the client have a specific deadline or is this an open-ended contract?
Hello, Lyra!!
I usually don't goo to this kind of posts but for real... what a bummer!
And, hey, going from not knowing what Shopify was to debugging CSS, layout issues, and JS conflicts in 3 days… that’s not small, even if it feels messy right now!
Also, this:
“¥1500 in every yuan of it tuition.”
That’s the mindset! I love it! Most people pay to learn this stuff, u know? You got paid and got thrown into real problems: that is a level up!
And yeah, what you’re running into is exactly where things stop being “basic”, and that’s the real work!
And I'm gonna be very honest here, Lyra, even if the job isn’t fully done yet - I can understand that can be frustrated- you already leveled up hard. And the only fact you can name the problems clearly means you’re way past beginner confusion. So cheer up!!
Hope someone helps you close those last issues, I'm not an expert on this field but wanted to cheer you up a little. You’re doing it the right way: in public, in the mess, learning fast!
Getting paid to learn the "Shopify struggle" is a classic rite of passage, Lyra. Those JS-injected inline styles are a nightmare even for seasoned devs, but fighting through the child width calculations is where you really earn that tuition.
I’m currently running a project in Tokyo (Tokyo Lore) that highlights builders who push through technical hurdles just like this. Since you're already in the trenches solving "unsolvable" CSS bugs, entering this round could be a great way to turn that hard-earned knowledge into a winning case study.
Haven’t worked much with Shopify themes, but those issues usually come from container overflow math or styles being reapplied by JS after load. If you share the page, happy to help debug with you.