자동 조정 방법

자동 조정 방법

그것의 내용에 따라 높이?

---

나는이 <div>그것의 내용에 따라 자동 조절 될 필요가있다. 어떻게 할 수 있습니까? 지금 내 콘텐츠는<div>

div에 사용한 클래스는 다음과 같습니다.

box-centerside  {
background:url("../images/greybox-center-bg1.jpg") repeat-x scroll center top transparent;
float:left;
height:100px;
width:260px;
}

---

높이를 직접 지정하는 대신 다음 마크 업을 사용해보십시오.

.box-centerside {
  background: url("../images/greybox-center-bg1.jpg") repeat-x scroll center top transparent;
  float: left;
  min-height: 100px;
  width: 260px;
}

<div class="box-centerside">
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
  This is sample content<br>
</div>

---

"min-height : XXX;"라고 쓰세요. 그리고 "overflow : hidden;" & 당신은이 문제에서 벗어날 것입니다.

min-height: 100px;
overflow: hidden;

---

그냥 써:

min-height: xxx;
overflow: hidden;

그러면 div콘텐츠의 높이가 자동으로 지정됩니다.

---

크기를 조정해야하는 DIV에서 다음을 사용했습니다.

overflow: hidden;
height: 1%;

---

내 프로젝트의 높이를 자동 조정하기 위해 손을 뻗었 고 해결책을 찾은 것 같습니다.

[CSS]
    overflow: auto;
    overflow-x: hidden;
    overflow-y: hidden;

이는 소수에 부착 할 수 있습니다 div(예를 들어 warpper,하지만에 body나 html페이지를 아래로 스크롤되지 않습니다 원인) CSS 파일과 그들에 다른 자식 클래스 및 쓰기 상속 overflow: inherit;속성.

주의 사항 : 홀수 일 내 넷빈즈 7.2.1 IDE 강조한다는 것입니다 overflow: inherit;으로 Unexpected value token inherit하지만, 모든 현대적인 브라우저가이 속성 벌금을 읽어보십시오.

이 솔루션은

• firefox 18+
• 코름 24+
• 즉 9+
• 오페라 12+

해당 브라우저의 이전 버전에서는 테스트하지 않습니다. 누군가가 그것을 확인하면 좋을 것입니다.

---

아직 답을 얻지 못했다면 "float : left;" 당신이 원하는 것을 엉망으로 만들고 있습니다. HTML에서 플로팅이 적용된 닫기 태그 아래에 컨테이너를 만듭니다. 이 컨테이너의 경우 다음을 스타일로 포함하십시오.

#container {
clear:both;
}

끝난.

---

Don't set height. Use min-height and max-height instead.

---

just use following

height:auto;

---

simply set the height to auto, that should fix the problem, because div are block elements so they stretch out to full width and height of any element contained in it. if height set to auto not working then simple don't add the height, it should adjust and make sure that the div is not inheriting any height from it's parent element as well...

---

Simple answer is to use overflow: hidden and min-height: x(any) px which will auto-adjust the size of div.

The height: auto won't work.

---

Set a height to the last placeholder div.

    <div class="row" style="height:30px;">
    <!--placeholder to make the whole block has valid auto height-->

---

Min- Height : (some Value) units  

---- Use only this incase of elements where you cannot use overflow, like tooltip

Else you can use overflow property or min-height according to your need.

---

I just used

overflow: hidden;

And it was worked for me properly. This div had some of float lefted divs.

---

You could try, div tag will auto fit height with content inside:

height: fit-content;

---

<div> should expand automatically. I guess that the problem is that you're using fixed height:100px;, try replacing it with min-height:100px;

---

use min-height instead of height

---

I have fixed my issue by setting the position of the element inside a div to relative;

---

height:59.55%;//First specify your height then make overflow auto overflow:auto;

---

For me after trying everything the below css worked:

float: left; width: 800px;

Try in chrome by inspecting element before putting it in css file.

---

Just use this display type:

display: inline-block;

참고URL : https://stackoverflow.com/questions/2920114/how-to-auto-adjust-the-div-height-according-to-content-in-it