Font-size for header is broken?

Custom CSS & Theme Design
1

Hi , I can’t adjust the font size in the header it just bugged and create fake new space,

image
image1064×1256 40.3 KB

.cm-header-2 { 
    color: black;
    background-color: #ffb6ec; 
    /* width: 40px;
    border-radius: 50px;
    padding: 10px;  add this line */
     /* font-size: 211px; */
     font-size: xx-large !important;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;  
}

.markdown-source-view .HyperMD-header-4 span {
	color: #91cf6d !important;
    font-size: 110px;
}

both doesn’t increase the font just new lines

2

You can edit the header font-size via these CSS.

body {
    --h1-size: ...;
    --h2-size: ...;
    --h3-size: ...;
    --h4-size: ...;
    --h5-size: ...;
    --h6-size: ...;

    --h1-line-height: ...;
    --h2-line-height: ...;
    --h3-line-height: ...;
    --h4-line-height: ...;
    --h5-line-height: ...;
    --h6-line-height: ...;
}

To know more about Obsdian’s CSS variables, please refer to the official website CSS variables - Developer Documentation

1 Like
3

oh I see many thanks ^^

4

does this work with snippet?

:root {
        --h1-size: 10px;
        --h1-line-height: 10px;
        --h1-color : red; 
}

I did this color and line-height work.

but size doesn’t work

5

Use body here:

body {
    --h1-size: 10px;
    --h1-line-height: 10px;
    --h1-color: red; 
}

That works using the default theme for me.