文本以多行显示，用于小尺寸屏幕

Question

我有

 @media screen and (max-width: 480px) {

      #footer {
        padding: 2em 1em 0.1em 1em;
      }
      #lineForUrl a #title-font {
max-width: 200px;
 overflow: visible;   
  display: inline-block;
font-size: smaller;
    }

    }


<span id="title-font" title="{{post.title}}">
          {{ post.title }}</span>

当它在小型设备中时，我希望这些单词是多行的。 我试过了overflow;scroll。

我希望它像

aaaaaaaaaaaa
aaaaaaaaaaaa
aaaaaaaaaaa

Answer 1

所以，正如我在评论中所说，你应该检查这个链接： How to force a line break in a loooooong word in a DIV?

这是一个JS小提琴解决方案，see it here

CSS代码：

    [self.navigationController.navigationBar setTitleTextAttributes:@{UITextAttributeTextColor:[UIColor whiteColor]}];