1
나는 몇 쿼리 위의 코드에서 CSS의 오버 플로우 속성은 실제로 어떻게 작동합니까?
.outer-div {
display: flex;
position: relative;
height: 3.5em;
width: 20%;
border: 2px solid #000000a3;
margin-left: 300px;
align-items: center;
border: 1px solid green;
}
.inner-div {
\t border: 1px solid blue;
position: absolute;
right: 1%;
font-size: 40px;
}<html>
<head>
</head>
<body>
<div class = "outer-div">
<div class = "inner-div">HelloWorld</div>
</div>
</body>,이 코드 아래 CSS- 체크 속성을 오버 플로우 관련 한 내부-DIV 컨테이너에 넘쳐 y 방향이 아닌 x 방향. 하지만 overflow: scroll을 추가하면 두 방향 (여기까지 정밀하게)에 스크롤 막대가 추가됩니다. 그러나 내부 - div 컨테이너가 있음에도 불구하고 x 방향이 아닌 y 방향의 스크롤 막대를 사용할 수 있습니다. x 방향으로 범람하고있다. 왜 그래야만하지? 확인이 조각,
.outer-div {
display: flex;
position: relative;
height: 3.5em;
width: 20%;
border: 2px solid #000000a3;
margin-left: 300px;
align-items: center;
border: 1px solid green;
overflow: scroll;
}
.inner-div {
\t border: 1px solid blue;
position: absolute;
right: 1%;
font-size: 40px;
}<html>
<head>
</head>
<body>
<div class = "outer-div">
<div class = "inner-div">HelloWorld</div>
</div>
</body>
</html>내가 하이픈으로 텍스트를 분리하면 내 마지막 쿼리는 - 그것은이 개 라인과하지에 침입 이유 또는 공간, () 같은 줄에서 계속 하시겠습니까? 내 외부 컨테이너의 크기가 있기 때문에 공백없이 텍스트를 입력하면 분할되지 않는 이유는 무엇입니까?? 확인 아래
.outer-div {
display: flex;
position: relative;
height: 3.5em;
width: 20%;
border: 2px solid #000000a3;
margin-left: 300px;
align-items: center;
border: 1px solid green;
}
.inner-div {
\t border: 1px solid blue;
position: absolute;
right: 1%;
font-size: 40px;
}<html>
<head>
</head>
<body>
<div class = "outer-div">
<div class = "inner-div">Hello World</div>
</div>
</body>
</html>감사 시간을주는 당신의 도움을 많이!
위치 절대 값은 컨테이너 방향을 앵커 방향 (사용자의 경우 '오른쪽')으로 간주하지 않습니다. – Yashas