亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

<p>I am new to programming and currently trying to make a simple one-page website using HTML/CSS and JS. I have a CSS class called 'general_container' in which I write text, which is also defined in CSS as 'div_text' (code for both is provided below): </p> <pre class="brush:php;toolbar:false;">.general_container{ margin: min(1vw,1vh) min(1vw,1vh); display: flex; height: fit-content; width: fit-content; max-width: 100%; max-height: 80vh; position: relative; padding: min(1vw,1vh); border-color: #232323; border-style: solid; border-width: 0.2rem; border-radius: 1rem; align-items: center; justify-content:center; overflow-x: hidden; overflow-y: auto; } .div_text { font-size: calc(12px 1.5vw); color: #F2F2F2; position: relative; }</pre> <p>The problem arises when the text is large compared to the div it is in: using the font size defined above, on my native resolution (2560x1440) the text is hidden and accessible via the scrollbar. However, the top of the scrollbar does not show the beginning of the text as shown in the image below (I used a generic placeholder text). </p> <p>I'm guessing that dynamic font sizes and constraints on div sizes are the cause of this behavior, but I don't know how to fix it. </p> <p>Image with text not accessible via scrollbar</p> <p> I tried modifying the div's constraints and overflow properties, but from what I read on the official Mozilla webdev guide, using overflow-y: scroll (auto defaults to scroll in this case) does what I want it to do Work. If you add more text, increasing max-height will cause the same problem. </p>

.general_container {
    /* ...其他屬性... */

    /* 刪除 justify-content: center; */
    /* 刪除 height 和 width fit-content */
    
    max-height: 600px; /* 根據(jù)需要進(jìn)行調(diào)整 */
    
    /* ...其他屬性... */

    overflow-x: hidden;
    overflow-y: auto;
}