Important modify css

Changeheight: 100%; to height: auto; the website do not break immediately.

.ql-editor {  
    box-sizing: border-box;  
    line-height: 1.42;  
    height: auto;   
    outline: none;  
    overflow-y: auto;  
    padding: 12px 15px;  
    tab-size: 4;  
    -moz-tab-size: 4;  
    text-align: left;  
    white-space: pre-wrap;  
    word-wrap: break-word;  
}

The only style in that stylesheet for .ql-size-large is .ql-editor .ql-size-large, meaning it applies to elements with the class ql-size-large which are nested inside an element with class ql-editor. So if you have this snippet:

<span class="ql-size-large">Hello, dear friends!</span>

Then you need to embed this inside an element with the class ql-editor to end up with:

<div class="ql-editor">
    <span class="ql-size-large">Hello, dear friends!</span>
</div>

Then the CSS selector .ql-editor .ql-size-large will apply and style that element.

Metadata

Status :: #🌱

Note Type :: #📩/📰

Source URL :: html - The Quill publicly available css - Stack Overflow

Author :: {作者名稱}

Topics :: {筆記跟什麼主題有關,用[Topic],[Topic] 格式子}

To Me :: #mind

Parent Link :: {可以連結到哪個父筆記}

Sibling Link :: {可以連結到哪個相關筆記}

Child Link :: {可以連結到哪個子筆記}