【问题标题】:Why doesn't "text-align-last" work on Safari and acts weirdly?为什么“text-align-last”在 Safari 上不起作用并且行为怪异?
【发布时间】:2020-10-15 12:54:05
【问题描述】:

这是我在 StackOverflow 上的第一个问题。直到今天,我总能在这个网站上找到我的问题的解决方案,但这次我必须打电话寻求帮助。

我需要显示来自数据库的文本。此文本包括换行符(不是<br>,只是一个空白返回 - 这就是它保存在数据库中的方式)。这段文字是有道理的。我在 Chrome 或 Firefox 上没有问题,但在 Safari 上,每个段落的最后一行(或准确地说是文本块)也是合理的,在单词之间创建了宽阔的空格。 奇怪的是,当我用光标突出显示文本时,每个段落的最后一行都向左移动。

我申请了text-align-last: left;,但它并没有改变 Safari 上的任何东西。我也试过-webkit-text-align-last: left;,但没有成功。 文本在<p> 中,我尝试将其放入<div> 中,但没有变化。

.quoteText {
    font-family: Georgia;
    font-style: italic;
    font-size: 18px;
    margin-top: 20px;
    margin-left: 3%;
    margin-right: 3%;
}
.justified {
    white-space: pre-line;
    text-align: justify;
    text-align-last: left;
}
<p class="quoteText justified">
            How often since then has she wondered what might have happened if she&#039;d tried to remain with him; if she’d returned Richard&#039;s kiss on the corner of Bleeker and McDougal, gone off somewhere (where?) with him, never bought the packet of incense or the alpaca coat with rose-shaped buttons. Couldn’t they have discovered something larger and stranger than what they&#039;ve got. It is impossible not to imagine that other future, that rejected future, as taking place in Italy or France, among big sunny rooms and gardens; as being full of infidelities and great battles; as a vast and enduring romance laid over friendship so searing and profound it would accompany them to the grave and possibly even beyond. She could, she thinks, have entered another world. She could have had a life as potent and dangerous as literature itself.

Or then again maybe not, Clarissa tells herself. That&#039;s who I was. This is who I am--a decent woman with a good apartment, with a stable and affectionate marriage, giving a party. Venture too far for love, she tells herself, and you renounce citizenship in the country you&#039;ve made for yourself. You end up just sailing from port to port.

Still, there is this sense of missed opportunity. Maybe there is nothing, ever, that can equal the recollection of having been young together. Maybe it&#039;s as simple as that. Richard was the person Clarissa loved at her most optimistic moment. Richard had stood beside her at the pond&#039;s edge at dusk, wearing cut-off jeans and rubber sandals. Richard had called her Mrs. Dalloway, and they had kissed. His mouth had opened to hers; (exciting and utterly familiar, she&#039;d never forget it) had worked its way shyly inside until she met its own. They&#039;d kissed and walked around the pond together.

It had seemed like the beginning of happiness, and Clarissa is still sometimes shocked, more than thirty years later to realize that it was happiness; that the entire experience lay in a kiss and a walk. The anticipation of dinner and a book. The dinner is by now forgotten; Lessing has been long overshadowed by other writers. What lives undimmed in Clarissa&#039;s mind more than three decades later is a kiss at dusk on a patch of dead grass, and a walk around a pond as mosquitoes droned in the darkening air. There is still that singular perfection, and it&#039;s perfect in part because it seemed, at the time, so clearly to promise more. Now she knows: That was the moment, right then. There has been no other.
        </p>

我希望整个文本是合理的,并且每个文本块的最后一行都向左对齐。同样,它适用于 Chrome 和 Firefox,但不适用于 Safari。

Screenshot of how the text is displayed (see the last lines of each block) and how the last line reacts when it is selected

【问题讨论】:

  • 您好,Safari 不支持:developer.mozilla.org/en-US/docs/Web/CSS/…
  • 谢谢。但是我该怎么做才能在 Safari 上正确显示我的文本呢?
  • 您运行的是哪个版本的 Safari?我正在尝试重新创建您的问题,但是当我尝试 Safari 10.1 时我没有遇到任何问题,并且最后一行只是与左侧对齐。
  • 我在 Safari 12.1.1

标签: html css safari


【解决方案1】:

实际上,Safari 不支持它。 请检查以供参考: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align-last

【讨论】:

    【解决方案2】:

    它与 safari 不兼容

    在使用任何新的 CSS 属性之前,请检查caniuse

    【讨论】:

      【解决方案3】:

      一种解决方法。我只对 safari 浏览器使用 text-indent。

      【讨论】:

        猜你喜欢
        • 2016-07-15
        • 2021-12-25
        • 1970-01-01
        • 2020-09-24
        • 2016-02-15
        • 1970-01-01
        • 2018-12-07
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多