제한 내가 CSS로 너무 좋은 아니에요

Question

사업부의 폭은 그래서 이것은 아마 바보 같은 질문이지만 ...

이다 나는 사용자 유형 하나에 있도록 행동하는 일부 자바 스크립트가있는 형태를 가지고 양식 입력 중 텍스트 형식이 동일한 페이지의 div에 나타납니다.

분당 div는 너비 : 960px입니다. 따라서 입력 양식에 입력 할 때 div에 텍스트가 나타나면 960px로되면 새로운 줄이 생기고 레이아웃이 엉망이됩니다.

편집 : 나는 그것이 사업부는 960의 X 30 픽셀의 최대가되고 싶어요 나는 텍스트가 맞지하지만 새로운 라인에 그 어떤 더 큰, 아니 오버 플로우하지 스크롤을하지 수 있도록하려면 막대가 나타납니다. 텍스트가 여전히 존재하고 그것이 할 수있는 가시적이지 않은 경우. 그것이 div 넘어서 갔지만 단지 눈에 보이지 않는 것처럼. 즉 할 것

나는 사업부에 최대 높이 및 최대 폭을 설정하려고했습니다하지만 (CSS를 읽은 후 자바 스크립트에 작용한다 가능성이 있기 때문에?)

작동하지 않았다 또한 양식 입력의 최대 길이를 설정 했으므로 그 문자와 일부 문자는 대문자/마침표 등입니다 ... 즉, 일부 문장은 매우 짧게 보일 것입니다. 예 : iiiiiiiiiiii 및 wwwwwwwwww (각각 10 자)

해결 방법에 대한 아이디어가 있으십니까? 편집

: 여기 는 일부 코드의 - 양식 입력

<div class="input text required"> 
    <label for="CampaignTitle">Title</label> 
    <input name="data[Campaign][title]" type="text" maxLength="76px" id="CampaignTitle" /> 
</div> 

업데이트되는 사업부에 대한 HTML :

<div id="titleBarWrap"> 
    <div id="titleBar" style="max-width:960px; max-height:76px;"></div> 
</div> 

는 CSS :

#topbar{background:url(../img/green/topBg.gif) repeat-x;height:67px;clear:both;} 
#titleBarWrap{width:960px;margin:auto;font-size:32px;font-weight:bold;color:#FFF; line-height:67px;} 
#mainCampContentWrap{width:960px;margin:auto;padding:24px;background:url(../img/green/mainCampContentWrapBg.gif) repeat-y;} 

JS :

$('#CampaignTitle').keyup(function() { 
    $('#titleBar').text(this.value); 
}); 

Answer 1

에 도달하면 자바 스크립트가

<BR> 

를 삽입 생각 :

overflow:hidden; 

당신에게

을 도울 수

Answer 2

정확하게 이해하면 div가 텍스트와 함께 커지고있는 것입니까? 그 이유는 다음과 같습니다.

overflow: auto; 

그런 다음 div는 동일한 크기로 유지되고 스크롤 막대가 간단히 나타납니다. 같은 또한 당신이 뭔가를 사용할 수 있습니다 : 당신이 수 마지막으로

word-wrap: break-word; 

텍스트가 특정 길이를