줄 바꿈 문제가 있습니다. 스크린 샷 1에서 볼 수 있듯이 텍스트는 괜찮지 만 브라우저가 아래로 당겨지면 (스크린 샷 2) 단어가 큰 공백을 남기지 않고 임의의 지점에서 텍스트가 깨집니다. 이상적으로는 한 번에 4 개의 단어가 모두 떨어지는 것이 아니라 필요할 때 각 단어를 떨어 뜨리고 싶습니다. 라인이 올바르게 깨지지 않음
이 사업부에 패딩이나 마진이 없다. 다음과 같은 단어 줄 바꾸기 변수를 시도했습니다 : normal, break-word, initial & inherit. 나는 공백을 시험해 보았다 : 보통, 노 랩핑, 프리, 초기 &은 성공하지 못한다.HTML/PHP :
<div class="full bottom-position">
<div class="half right">
<?php if (get_sub_field('client_name')) : ?>
<span class="left-span">Client:</span>
<span class="right-span"><?php the_sub_field('client_name'); ?></span>
<?php endif; ?>
<?php if (get_sub_field('date')) : ?>
<span class="left-span">Date:</span>
<span class="right-span"><?php the_sub_field('date'); ?></span>
<?php endif; ?>
<?php if (get_sub_field('version')) : ?>
<span class="left-span">Version:</span>
<span class="right-span"><?php the_sub_field('version'); ?></span>
<?php endif; ?>
<?php if (get_sub_field('print')) : ?>
<span class="left-span">Print:</span>
<span class="right-span"><a href="<?php the_sub_field('print'); ?>">Download presentation as PDF</a></span>
<?php endif; ?>
</div>
</div>
CSS :
.left-span {
width: 15%;
float: left;
}
.right-span {
width: 85%;
float: left;
}
.half {
width: 50%;
height: auto;
}
.right {
float: right;
}
이것은 내가 전에 건너 적이 이상한 문제입니다. 어떤 도움을 주시면 감사하겠습니다. 피들은 여기에서 찾을 수 있습니다 : http://jsfiddle.net/qkt93epw/
코드를 게시 할 수 있습니까? –
'word-wrap : break-word;'? – Benjamin
[fiddle] (http://jsfiddle.net/) 코드를 사용할 수 있습니까? – Benjamin