contentEditable의 빈 단락을 가져올 수 없습니다.

위와 아래 단락이있는 "EmbeddedSection"div (재귀 적)과 함께 contentEditable 기사가 있습니다. 크롬에서 단락이 비어 있으면 실제로 도달 할 수 없습니다. IE에서는 할 수 있지만 크기는 모두 잘못되었습니다.contentEditable의 빈 단락을 가져올 수 없습니다.

http://jsfiddle.net/hE8zS/1/

<article contenteditable="true"> 
    <p><span class="numbering">Title</span><span class="TextChunk"></span></p> 
    <div class="EmbeddedSection"> 
     <p><span class="numbering">1</span><span class="TextChunk">Section Title</span></p> 
     <div class="EmbeddedSection"> 
      <p><span class="numbering">1.1</span><span class="TextChunk">Embedded title</span></p> 
      <p><span class="TextChunk">Th</span><span class="TextChunk">e </span><span class="TextChunk">.</span></p> 
     </div> 
     <p><span class="TextChunk"></span></p> <!--Can't get to this element--> 
     <div class="EmbeddedSection"> 
      <p class="Paragraph"><span class="numbering">1.2</span><span class="TextChunk">Another title</span></p> 
      <p class="Paragraph"><span class="TextChunk">Blah blah blah</span></p> 
     </div> 
     <p><span class="TextChunk">Can get here, but not the one above 1.2 in chrome (ie gets there).</span></p> 
     <div class="EmbeddedSection"> 
      <p class="Paragraph"><span class="numbering">1.3</span><span class="TextChunk">Another title</span></p> 
      <p class="Paragraph"><span class="TextChunk">Blah blah blah</span></p> 
     </div> 
     <p><span class="TextChunk"></span></p> <!--Can't get to this element--> 
    </div> 
</article>

아무도 내가 빈 단락 스타일을 할 수 있어요 알고 또는 도달 할을 수 뭔가로 표시 어떻게 든합니까?

(참고 : 심지어 하나의 공백 문자를 넣는 것은 사용자가 편집 및 공백 문자 것을 제거 후에도 작동합니다.)

출처

2013-07-18 gremwell

당신은

:empty { 
    display: block; 
    height: 1em; 
}

을 추가 할 수 있습니다 그리고 작동하는 것 같다 : http://jsfiddle.net/hE8zS/3/

를

이 페이지는 브라우저 호환성에 대한 정보를 포함합니다. https://developer.mozilla.org/en-US/docs/Web/CSS/:empty

출처

2013-07-18 04:33:34 kalley

당신은 작동합니다. – gremwell

'[contenteditable] : focus : empty'를 사용하여 그것을 타켓팅 할 수도 있습니다. 그러면 다른 빈 엘리먼트는 숨겨진 상태로 남을 것입니다. – kalley

굉장합니다. 내가 선택한 요소들처럼 보이게 만들 수 있는지 어떻게 아십니까? 이러한 빈 요소를 선택하면 해당 비트가 선택되었음을 보여주는 시각적 피드백이 없습니다. 예 : 빈 요소를 강조 표시하면 위의 요소가 강조 표시되지만 빈 요소는 아무것도 표시되지 않는 것을 볼 수 있습니다. – gremwell

나는 실제로 이리저리 옮겼습니다. 사용하여 : 오른쪽으로 선택하지 않는 빈 및 contenteditable 함께 좋은 재생되지 않습니다.

실제로 비어있는 단락 (예 : keypress에서 건너 뛸 수있는 일부 자바 스크립트)에 제로 - 공백을 넣었습니다. 정확히 크기를 지정하고 contenteditables와 잘 어울립니다. 크롬에 대한 내 버그 보고서를 여기에서보십시오 http://code.google.com/p/chromium/issues/detail?id=292334

출처

2013-09-19 05:43:01 gremwell

contentEditable의 빈 단락을 가져올 수 없습니다.

답변

관련 문제