Default CSS

At a glance

The community member is looking for the best way to modify or remove the default CSS styles applied to elements like p and h# in Webstudio, and set a global paragraph style without having to add a class to each paragraph. The comments suggest two approaches:

1. Set a token for the body element and apply global styles like font and size to it, which will then be applied to all elements within it.

2. Add the CSS rule * { margin: 0; } to remove the default margin applied by the browser, as Webstudio is not setting these styles.

However, one community member notes that the second approach may not be reflected in the style panel.

SSteve Suderman

What's the best way to modify/remove some of the default CSS built into WS like <p> and <h#> elements? I would like to be able to set a global paragraph style without having to add a class to each paragraph.

Attachment

3 comments

ppaso_sb

Set a token for the body. You give the token the global things such as font, size etc.. This is then applied to all elements in it

JJohn Siciliano

Paso is correct for the styles he mentioned but that wont remove default margin... those are actually browser default styles (Webstudio isn't setting them). I personally add this in my global css

Plain Text

* {
  margin: 0;
}

It says remove default margin from every single element

BBogdan

But it will not be reflected in style panel

Add a reply

Join the Webstudio community

Default CSS