將字符串的右側邊緣放置在距離頁面中心一定距離的位置上。CSS

名稱說明了所有內容，但我希望能夠根據頁面中心定義的距離定位元素，但測量必須位於元素的中心和右手邊之間。將字符串的右側邊緣放置在距離頁面中心一定距離的位置上。CSS

這是可能的嗎？

2011-03-21 Mild Fuzz

'' 「中心之間的」 - 是某種特殊的超級中鋒？我想我知道你在問什麼，但考慮繪製一個快速的圖像，以便人們確信。 – thirtydot 2011-03-21 11:51:52

oooops，我的壞。我只是指父元素的中心。多餘的是由於過早的咖啡因，我會說。 – 2011-03-21 11:54:43

是否允許在要定位的元素上指定固定寬度？元素被放置在什麼上下文中？它應該出現在其他元素之上嗎？（我仍然喜歡一張照片或其他東西） – thirtydot 2011-03-21 11:58:45

我相信這是你想要的（如果我正確理解）

position:absolute; 
right:50%; 
margin-right:-<distance_you_want>px;

父元素也應該被定位（absolute或relative）

演示在http://jsfiddle.net/gaby/jD443/（垂直線在中心的框圖）

來源

2011-03-21 11:59:52

但這需要我知道距離，我不知道元素的寬度，因此無法知道其右手邊緣的位置。 – 2011-03-21 13:09:01

@Mild，不，它不。我提到的距離是距離中心的距離。我把0放在元素的右邊緣位於父元素的中心。 – 2011-03-21 14:08:56

我明白了，好的！ – 2011-03-21 15:17:16

See example of the following →

你需要一個額外的包裝，但是命中可以與具有position:relative; margin:0 auto; width:1px一個孩子，並且具有position:absolute; right:XXpx;其中XX是你想要的中央偏右的距離孫子來完成。

<div id="parent"> 
    <div id="child"> 
     <div id="kid">40px right of center ==&gt;</div> 
    </div> 
</div> 

#parent { 
    width:400px; height:200px; 
} 
#child { 
    margin:0 auto; 
    position:relative; 
    width:1px; height:200px; 
} 
#kid { 
    text-align:right; 
    position:absolute; right:-40px; 
    width:180px; 
}

See example →

來源

2011-03-21 12:09:44 mVChr

將字符串的右側邊緣放置在距離頁面中心一定距離的位置上。CSS

回答

相關問題