CSS - 將div內的長連續文本向右移動？

我有一個長文本不適合它佔據的div。 div類如下：CSS - 將div內的長連續文本向右移動？

.mydiv { 
    overflow:hidden; 
    padding:3px 3px 3px 5px; 
    white-space:nowrap; 
}

當然，我只能看到部分文本。問題是它顯示前N個字符，我想顯示最後N個字符。我如何用CSS實現它？ Text-align在這裏沒有幫助。

來源

2010-07-23 Bostone

如果您可以將文字包裝到其他元素中，可以按照this fiddle中的說明使其工作。我向右移動了一個嵌套的<span>。

來源

2010-07-23 21:56:00 Pat

賓果！這對我來說非常合適，謝謝Pat – Bostone 2010-07-23 22:51:10

你將不得不使用JavaScript來滾動DIV一路向右，試着：

var obj = document.getElementById("div-id"); 
obj.scrollLeft = obj.scrollWidth - obj.clientWidth

來源

2010-07-23 21:56:08 jordanstephens

<div class="wrap"> 
    <div class="window">Lots of text</div> 
</div> 

.wrap { overflow: hidden; position: relative; } 
.window { position: absolute; right: 0px; }

來源

2010-07-23 21:58:12

就像一個註釋：float：就像在Pat的例子中一樣，爲我的特定情況工作得更好 – Bostone 2010-07-23 22:52:44

你可以只用CSS做：

http://jsbin.com/ususu

<div style="width: 150px; border: 1px solid red; overflow: hidden; position: relative; height: 2em;"> 
     <div style="position: absolute; right: 0px; padding: .5em;white-space:nowrap;"> 
    aaaaaaaaaaaabbbbbbbbbcccccccccccccccccddddddddddddddddddddeeeeeeeeeeeeeeeeeeeeffffffffffffffffffffgggggggggggggggggggghhhhhhhhhhhhhhhhiiiiiiiiiiiii 
    </div> 
    </div>

（在Firefox中測試.YMMV）

來源

2010-07-23 22:00:40

CSS - 將div內的長連續文本向右移動？

回答

相關問題