빈 줄없이 긴 줄을 어떻게 감쌀 수 있습니까?

빈 줄없이 긴 줄을 어떻게 감쌀 수 있습니까?

---

긴 문자열 (DNA 서열)이 있습니다. 공백 문자를 포함하지 않습니다.

예를 들면 다음과 같습니다.

ACTGATCGAGCTGAAGCGCAGTGCGATGCTTCGATGATGCTGACGATGCTACGATGCGAGCATCTACGATCAGTCGATGTAGCTAGTAGCATGTAGTGA

이 텍스트를 a html:textarea또는에 래핑하도록 강제하는 CSS 선택기는 무엇입니까 xul:textbox?

---

블록 요소의 경우 :

<textarea style="width:100px; word-wrap:break-word;">
  ACTGATCGAGCTGAAGCGCAGTGCGATGCTTCGATGATGCTGACGATGCTACGATGCGAGCATCTACGATCAGTC
</textarea>

인라인 요소의 경우 :

<span style="width:100px; word-wrap:break-word; display:inline-block;"> 
   ACTGATCGAGCTGAAGCGCAGTGCGATGCTTCGATGATGCTGACGATGCTACGATGCGAGCATCTACGATCAGTC
</span>

---

장소 제로 폭 공간을 당신이 휴식을 허용 할 점. 너비가 0 인 공간은 ​HTML입니다. 예를 들면 다음과 같습니다.

ACTGATCG​AGCTGAAG​CGCAGTGC​GATGCTTC​GATGATGC

---

다음은 매우 유용한 답변입니다.

긴 단어가 내 div를 깨는 것을 방지하는 방법은 무엇입니까?

시간을 절약하기 위해 CSS로 해결할 수 있습니다.

white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
word-break: break-all;

---

저에게는 이것이 효과가 있습니다.

<td width="170px" style="word-wrap:break-word;">
  <div style="width:140px;overflow:auto">
    LONGTEXTGOESHERELONGDIVGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESLONGTEXTGOESHERELONGDIVLONGTEXTLONGTEXT
  </div>
</td>

대신 다른 div 안에 div를 사용할 수도 있습니다 td. 내가 사용하는 overflow:auto내 오페라와 IE 브라우저에서 모두 모든 텍스트와 같이.

---

CSS로 이것을 할 수 있다고 생각하지 않습니다. 대신 문자열을 따라 일정한 '단어 길이'에서 HTML 소프트 하이픈을 삽입하십시오.

ACTGATCG­AGCTGAAG­CGCAGTGC­GATGCTTC­GATGATGC­TGACGATG

줄 끝에 하이픈이 표시되어 줄 바꿈이되어 원하는대로 표시 할 수 있습니다.

참고 Safari <textarea>는 Firefox와 달리 어쨌든 긴 문자열을 감싸는 것 같습니다 .

---

공백이없는 문자열을 강제로 줄이려면 CSS 메서드를 사용하십시오. 세 가지 방법 :

1) CSS 공백 속성을 사용하십시오. 브라우저 불일치를 다루려면 몇 가지 방법으로 선언해야합니다. 따라서 looooong 문자열을 일부 블록 레벨 요소 (예 : div, pre, p)에 넣고 해당 요소에 다음 CSS를 제공하십시오.

some_block_level_tag {
    white-space: pre;           /* CSS 2.0 */
    white-space: pre-wrap;      /* CSS 2.1 */
    white-space: pre-line;      /* CSS 3.0 */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -hp-pre-wrap;  /* HP Printers */
    word-wrap: break-word;      /* IE 5+ */
}

2) Compass 의 강제 랩 믹스 인을 사용하십시오 .

3) 나는 이것도 조사하고 있었고 또한 효과가 있다고 생각합니다 (그러나 브라우저 지원을보다 완벽하게 테스트해야합니다).

.break-me {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

Reference: wrapping content

---

My way to go (when there is no appropiate way to insert special chars) via CSS:

-ms-word-break: break-all;
word-break: break-all;
word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

As found here: http://kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/ with some additional research to be found there.

---

For word-wrap:break-word; to work for me, I had to make sure the display was set to block, and that the width was set on the element. In Safari, it had to have a p tag and the width had to be set in ex.

---

If you're using PHP then the wordwrap function works well for this: http://php.net/manual/en/function.wordwrap.php

The CSS solution word-wrap: break-word; does not seem to be consistent across all browsers.

Other server-side languages have similar functions - or can be hand built.

Here's how the the PHP wordwrap function works:

$string = "ACTGATCGAGCTGAAGCGCAGTGCGATGCTTCGATGATGCTGACGATGCTACGATGCGAGCATCTACGATCAGTCGATGTAGCTAGTAGCATGTAGTGA";

$wrappedstring = wordwrap($string,50,"<br>",true);

This wraps the string at 50 characters with a <br> tag. The 'true' parameter forces the string to be cut.

---

<textarea style="width:100px; word-wrap:break-word;">
  place your text here
</textarea>

---

In a case where the table isnt of fixed size, below line worked for me:

style="width:110px; word-break: break-all;"

---

just setting width and adding float worked for me :-)

width:100%;
float:left;

---

Use <wbr>tag:

ACTGATCG<wbr>AGCTGAAG<wbr>CGCAGTGC<wbr>GATGCTTC<wbr>GATGATGC

I think this is better than using zero-width space ​ which could cause problems when you copy the text.

참고URL : https://stackoverflow.com/questions/499137/how-can-i-force-a-long-string-without-any-blank-to-be-wrapped