將文本/元素放置在HTML文檔的右側

我想要的：將文本或元素粘貼到文檔的右側，而不是窗口。但是，目前沒有實現（position: absolute; right:0;），當我調整窗口大小時，文本始終停留在窗口的右側，即使有一個滾動條出現（因爲頂部的元素具有固定的寬度）。當我向右滾動時，文本不再對齊。將文本/元素放置在HTML文檔的右側

這裏是例子：

http://jsfiddle.net/N5jc9/

需要注意的是，我對container1無法控制。任何人都有使用CSS的良好解決方案？

來源

2012-10-01 Grace Shao

您可能正在尋找'position：fixed'而不是'position：absolute'？ – pjam

將容器2放入容器1內並使容器1的位置相對。

來源

2012-10-01 18:56:42

謝謝！但我無法控制'container1'。 –

嘗試使用另一個具有相對位置/固定/絕對位置的div來包裝container2 –

您可能舉個例子嗎？ –

使用位置：固定的，而不是位置：絕對

編輯：http://jsfiddle.net/8geAC/7/

<html> 
<head> 
<style type="text/css"> 
#Layer1 { 
width: 100px; 
height: 20px;  
background-color: red; 
display:block; 
} 

#Layer2 { 
width:150px; 
position:relative; 
right:0px; 
} 
</style> 
<script type="text/javascript"> 
function getDim() { 
var id="Layer1"; 
gh = document.getElementById(id).offsetWidth; 
document.getElementById("Layer2").style.width=gh+"px"; 
} 
</script> 
</head> 

<body onload="getDim();"> 

<div id="Layer1">HAdfgd</div> 
<div id="Layer2"> 
<a href="#" style="float:right;">here</a> 
</div> 
</body>

來源

2012-10-01 19:01:04

它似乎不工作。見http://jsfiddle.net/N5jc9/1/ –

你想要它在頂部？ –

我想讓container2在container1下。 –

可以使用:after僞元素，並將其定位到您的<body>元素的右邊。當然，只有當您爲<body>元素設置了固定/分鐘寬度時纔會顯而易見。

演示：http://jsfiddle.net/PPtD5/2/

代碼：

body { 
    width: 70%; 
    height: 200px; 
    position: relative; 
} 
body::after { 
    content: "This one sticks to the right of <body>"; 
    width: 100px; 
    position: absolute; 
    right: -120px; 
    top: 0; 
}

來源

2012-10-01 19:05:08 techfoobar

謝謝！我也無法控制'body'。 –

不知道如果我完全理解你所擁有的控制container1，但如果你申請顯示：inline-block的每一類文本將出現在容器的右側1

來源

2012-10-01 19:09:12

基本上container1的原因是定義文檔的最小寬度。不幸的是，我無法移動container1中的文本。 –

將文本/元素放置在HTML文檔的右側

回答

相關問題