While adding border style for Html component css json only fetching for border selector not fetching selector of border-width, border-style, border-colorBUG:
@artf how to resolve this problem i'm face the same issues in my side latest version v0.18.4 padding: 0 0 0 0, padding-top: "", padding-bottom: "", padding-right: "", padding-left: "",
Read full answer below ↓Question
GrapesJS version
- I confirm to use the latest version of GrapesJS
What browser are you using?
chrome v101.0.4951.54
Reproducible demo link
https://jsfiddle.net/7sn5h91r/7/
Describe the bug
- my issue is for style border property width, style and color not updating in json even i have checked in https://grapesjs.com/demo.html. please check the attached screenshot. below is my code JSON response. tell me how to remove that empty properties like border-width, border-style,border-color.
my response JSON:{
"selectors": "is98i",
"style": {
"width": "100%",
"__p": false,
"height": "5%",
"margin-bottom": "15px",
"border-radius": "5px",
"border": "1px solid #d6d6d6",
"border-width": "",
"border-style": "",
"border-color": ""
},
"mediaText": "(max-width: 480px)",
"atRuleType": "media"
}

Code of Conduct
- I agree to follow this project's Code of Conduct
Answers (4)
@artf how to resolve this problem i'm face the same issues in my side latest version v0.18.4 padding: 0 0 0 0, padding-top: "", padding-bottom: "", padding-right: "", padding-left: "",
Hi @aharishsundhar .. As per my knowledge instead of using padding: 0 0 0 0; you can add only pading-top, padding-bottom,padding-left,padding-right...
@senthil177cse im getting the same issues on padding : 0 0 0 0; created also the padding-top create but empty properties coming how to fix the problem is its issues with grapesjs v0.18.4?
Thanks for reporting this, @senthil177cse.
Great question about while adding border style for Html component css json only fetching for border selector not fetching selector of border-width, border-style, border-colorBUG:. The recommended approach with StyleManager is to use the event-driven API.
Start here:
- Check the GrapesJS documentation for your specific module
- Look for the
on()event listener method - Most operations can be achieved by listening to editor and component events
Common patterns:
// Listen for changes
editor.on('change', () => console.log('something changed'));
// Component lifecycle
editor.on('component:mount', (c) => console.log('component ready', c));
editor.on('component:update', (c) => console.log('component updated', c));
If you're still stuck:
- Share a minimal CodeSandbox reproduction
- Include what you've already tried
- Mention your GrapesJS version
- The community is here to help!
Related Questions and Answers
Continue research with similar issue discussions.
Issue #6458
sector.setName doesn't work
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfi...
Issue #5263
Deleting a component without deleting its corresponding style, will adding new components later cause style conflicts?
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? latest version of Chrome Reproducible demo...
Issue #4411
XSS when add class name to Selector Manager
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v102 Reproducible demo link https:/...
Issue #4310
Style Manager is inaccurate when using combined CSS selectors which contains "bout" and componentFirst = true
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 100 Reproducible demo link https://...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.