如何使跨度元素的餘量正確工作？

我有一個span元素，我希望出現在頁面的右下角。爲此，我使用了margin-right:10px。但它沒有效果。在margin-left的作品。爲什麼是這樣？以及如何使span元素出現在頁面的右側？如何使跨度元素的餘量正確工作？

2013-03-10 Ashwin

保證金，權利是右邊距。

如果你想對齊它的權利，你可以使用右：10px，如果位置是絕對的。

否則，你可以使用float：正確的

您也可以設置顯示：inline-block的以跨度。

2013-03-10 05:58:21

@穆罕默德納西爾：那麼保證金是如何工作的？ – Ashwin 2013-03-10 05:59:12

因爲它已經對齊左邊的角落，所以當你設置邊距時，左邊的邊緣對你來說是清晰可見的。當您設置邊距時，邊距右邊也有效，但是因爲它沒有對齊，所以您看不到效果。 – 2013-03-10 06:06:54

我認爲你要找的是float：right;

2013-03-10 05:58:00

試試這個（jsFiddle）

.right-corner { 
    float:right; 
}

或本（jsFiddle）

.right-corner { 
    position:absolute: 
    top:0; 
    right:0; 
}

是保證金右不起作用的原因是因爲它只是給你的元素的右邊緣不重新定位它。爲了幫助你理解，如果你在margin-right之後加入了一些東西，那麼它們之間就會有差距，這就是餘量。

margin-left也這樣做，它只是在左側進行，因爲元素是從左到右的位置，左側的空白看起來像剛剛向右移動。

看看this little example試圖瞭解。如果您不明白，您應該閱讀CSS box model。

CSS box model, from www.w3.org/TR/CSS2/box.html

2013-03-10 05:58:13

爲了完成@Tyriar答案，這裏是一個小提琴也顯示出你使用的text-align: right。爲什麼保證金可以存在但沒有可觀察到的效果。還如何使用clear屬性浮動元素和/或浮動元素的容器一個clearfix後（兩者都是沒有必要在這裏）

還有一個忠告：如果你不要使用絕對定位不是真的（真的）確定你想要達到什麼以及如何實現;大多數情況下，這不是CSS問題的最佳解決方案。完全沒有流量，其內容將顯示在其他內容沒有任何照顧...

2013-03-10 06:48:17 FelipeAls

但是文字對齊不適用於img，對吧？ – Ashwin 2013-03-22 01:56:58

父級控制其內容的水平對齊。'img'本身沒有內容，所以是無效的afaik和對齊其父母將對齊圖像（或文本替換，如果由於任何原因圖像無法顯示） – FelipeAls 2013-03-22 09:21:55

回答