Question

我正在寻找一个选项，以宽度的某个百分比对齐文本。它将是一个div，其中文本未在中心或左侧对齐。它需要介于两者之间如果有一个简单的方法可以做到这一点，我并不害羞，但她是一个更好地解释它的例子。

div的宽度是恒定的，但文本会发生变化短文本应该在行下面，但是当文本变大时，它只会像它在中心时那样正常地扩展，直到它只是右边的空格。然后它的行为类似于普通的左对齐文本。
如果这样的话可能会很好： text-align:30%;
example with long text

更新： example, very short text

Answer 1

为什么不使用填充？

.text-to-align {
    padding-left: 30%;
}

这是一个有效的jsfiddle示例： https://jsfiddle.net/umw5mrde/1/

更新：问题已更新，此处已修改答案以匹配它：我发现纯css无法做到这一点，但有一个使用javascript javascript的解决方案。它从父宽度的30％减去标签宽度的30％。该值分配给标签的左边距。

$(".text-to-align").each(function(index) {
    var padding = ($(this).parent().width() - ($(this).width())) * 0.3  + "px";
    // alert(padding);
    $(this).css("padding-left", padding);
});

工作jsfiddle示例： https://jsfiddle.net/umw5mrde/2/

但你绝对应该避免它。当你的设计太复杂而需要javascript时，请更改它。

css text-align at 30％

1 个答案: