[Bug]: Background-image not picked up from styles attribute
Question
As title + background-image is removed by styles manager when added a background layer.
- Getting started: https://jsfiddle.net/5upe6myo/
- Note background-image
- Click between the text. Should show as "Box".
- Under Styles > Decorations, the background-image isn't shown.
- Clicking "+" next to background removes the background-image.
Answers (3)
The styles I've defined for my element aren't reachable in the style manager. When I click the box in the canvas I'd really expect to see all the styles it has in the style manager, rather than the the styles of the class Grapes has added.
You said that the background doesn't show because it's using the .fluid-container.c318 but adding color: Pink to the style attribute does show the colour in the typography section. That's a little inconsistent. It's picking up the color attribute but not the background-image one.
Actually, this is how style manager works with classes. When you select the "Box" you can see that you have picked ".fluid-container.c318" selector, which doesn't have any bg, but when you uncheck "fluid-container" class, the current selector will be "c318" and now the bg is shown. Probably we need to highlight better the inheritance of styles
This seems a little weird. Grapes adding the class c318 makes my styles unreachable. I'd expect the html and styles provided to be editable.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1812
[Bug]: 404 when trying to add background image (reproducible in demo)
Visit https://grapesjs.com/demo.html in Chrome IncognitoClick the "Header" elementClick Decorations > BackgroundDelete Layer 2Click Layer 1...
Issue #4323
BUG: Performance issue while dragging component to canvas when you have 2k component on canvas
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Google Chrome Version 101.0.4951.41 (Officia...
Issue #2366
Text-shadow removes rgb values when element selected
Example: https://jsfiddle.net/benvmatheson/g1ft06qh/8/ Import a style with a text property. text-shadow:rgb(51, 166, 58) 4px 4px 4px; This...
Issue #2896
BUG: Default value "This window" for link's property "Target" is not shown in selectbox
Steps:Open fiddle https://jsfiddle.net/x2g03d58/ with simple markup <a id="ic72">Link</a><a target="_blank" id="is3u">Link</a>Select first...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.