내부 divad가 더 커짐에 따라 outter div를 동적으로 변경하십시오.

Question

두 div가 있습니다. outter 하나는 #wrapper라고 부르며, 내부 하나는 #pad라고합니다.

#pad는 사용자 입력을 허용하고 사용자 입력 내용을 기반으로 #pad의 내용을 변경하는 javascript (jQuery) 함수를 사용합니다. 때로는이 기능으로 인해 패드의 내용으로 인해 div가 이전보다 길어집니다. 이제 분명히 # wrapper가 패드의 길이에이 변화를 수용하기 위해 길어지기를 바랄 것입니다. 그러나 이것은 발생하지 않습니다.

#wrapper 
{ 
    clear:both; 
    padding-top:0.5em; 
    /*padding-left:50px;*/ 
    height: 100%; 
    background-color: rgba(255,255,255,0.4); 
    -moz-border-radius: 20px 20px 0px 0px; 
    -webkit-border-radius: 20px 20px 0px 0px; 
    border-radius: 20px 20px 0px 0px; 
} 

#pad 
{ 
    margin-top: 25px; 
    -moz-border-radius: 5px; 
    border: solid 1px #DDD; 
    margin-left:25px; 
    padding-left:25px; 
    margin-right:25px; 
    padding-right:25px; 
    margin-bottom:2em; 
} 

이 자바 스크립트 함수 :

function preview() 
{ 
    var id1=$("#input1").val(); 
    var id2=$("#input2").val(); 
    var id3=$("#input3").val(); 
    var id4=$("#input4").val(); 
    var id5=$("#input5").val(); 

    if(id1!= null && id1!="") 
    { 
     if($("#preview1").attr("src")!=id1) 
     { 
      $("#preview1").attr("src",id1); 
      $("#preview1").fadeIn("slow"); 
     } 
    } 
    else 
    { 
     $("#preview1").attr("src",""); 
     $("#preview1").fadeOut("slow"); 
    } 

    if(id2!= null && id2!="") 
    { 
     if($("#preview2").attr("src")!=id2) 
     { 
      $("#preview2").attr("src",id2); 
      $("#preview2").fadeIn("slow"); 
     } 
    } 
    else 
    { 
     $("#preview2").attr("src",""); 
     $("#preview2").fadeOut("slow"); 
    } 

    if(id3!= null && id3!="") 
    { 
     if($("#preview3").attr("src")!=id3) 
     { 
      $("#preview3").attr("src",id3); 
      $("#preview3").fadeIn("slow"); 
     } 
    } 
    else 
    { 
     $("#preview3").attr("src",""); 
     $("#preview3").fadeOut("slow"); 
    } 
    if(id4!= null && id4!="") 
    { 
     if($("#preview4").attr("src")!=id4) 
     { 
      $("#preview4").attr("src",id4); 
      $("#preview4").fadeIn("slow"); 
     } 
    } 
    else 
    { 
     $("#preview4").attr("src",""); 
     $("#preview4").fadeOut("slow"); 
    } 
    if(id5!= null && id5!="") 
    { 
     if($("#preview5").attr("src")!=id5) 
     { 
      $("#preview5").attr("src",id5); 
      $("#preview5").fadeIn("slow"); 
     } 
    } 
    else 
    { 
     $("#preview5").attr("src",""); 
     $("#preview5").fadeOut("slow"); 
    } 
    setTimeout("preview()",1000); 
    $("#wrapper").attr("height",$(document).attr("height")); 
} 

지금까지 내가의 #wrapper 높이 없애 말할 수

http://surveys.mylifeisberkeley.com/

Answer 1

: 100 % 마진과 물건을 만들기 위해 패딩을 조정 적합하고 작동해야합니다. 나는 문제가 대부분 요소 속성 높이와 CSS 속성 높이를 섞어 놓은 것이라고 생각합니다. 어쨌든이 모든 것은 수동으로 높이를 변경하는 대신 일반적인 HTML 흐름을 사용하여 간단히 수행 할 수 있어야합니다.

"길쭉한"말은 아주 이상한 말입니다. 나는 당신이 말하기를 "더 높다"고 생각합니다.