css：文本對齊，邊距和填充如何一起工作

我在做一個簡單的引語時出現問題，引號居中/漂浮在頁面上，並且引號底下的人名稱與右側一致看到。css：文本對齊，邊距和填充如何一起工作

我試着改變人的姓名段落的文本對齊到「正確」，但沒有解決它（它把它放得太遠了）。所以，我離開文本對齊（作爲「中心」），然後嘗試添加填充左側和空白左側，但這兩個都被忽略，留下該人的名字在中心。 你能告訴我爲什麼這些（填充和邊距）被忽略爲，也是一種很好的方式來進行對齊，這樣「其他人」的行匹配到右邊的引用？

您可以在這裏頂部的灰色標題區域看網頁，用引號：http://www.momentumnow.biz/mn/direct/testimonials2.shtml

我想搬過來的名字，但很好奇，爲什麼似乎填充和利潤率不具有的影響與文本對齊。

enter image description here

謝謝。

來源

2012-02-23 Ray

請注意我修復了一些有問題的拼寫錯誤。 – Ray 2012-02-23 08:15:11

請記住，特別是引號的標籤 - 你應該使用那些......'blockquote'更長，'q'用於簡短的引號。 – Christoph 2012-02-23 09:24:59

事實上，你有兩個p元素意味着它們分開顯示 - p代表段落。嘗試將其中一個放入另一箇中，或者將它們都放在一個div中，然後應用絕對定位。或者，使用我的首選方法，即將其更改爲span標記。

請記住，<p>是塊級元素，而span是內聯元素。

根據我的理解，您希望實現類似this之類的內容。嘗試使用float: right

你也可以使用CSS

p.yourclass {text-align: right}

解決方案：http://jsfiddle.net/TqE2x/

來源

2012-02-23 08:25:07 jacktheripper

嗯。我希望他們堆疊，但是一個在另一個之上，哪個塊級元素會做。跨度元素不堆疊，對吧？另外，請注意它們都被包裹在一個div中。 – Ray 2012-02-23 08:26:45

是的，看到這個例子http://jsfiddle.net/9KRjt/ – jacktheripper 2012-02-23 08:27:32

目前還不清楚你的目標是達到什麼目的，請改善你的發佈想要的圖片的答案你可以給我一些代碼！ – jacktheripper 2012-02-23 08:28:08

你想要的報價，並在單行或名稱的名稱要對齊，右與引用？

這將使報價和名稱上的單個line--

改變這個CSS

p.headerCenter { 
font-size: 15px; 
font-weight: bold; 
font-style: italic; 
float: left; 
}

來源

2012-02-23 08:37:35

你不能做到這一點僅直接與CSS。

通過在報價單上使用text-align:center;，您無法控制文字將向多大的範圍擴展到右側。

這就是爲什麼您無法直接在報價右邊緣下方對齊人員名稱的原因。

保證金和填充將始終工作，因爲您期望blocklevel-elements並對「在線元素」有一些限制。我不知道，你的問題是什麼。

但是，使用Javascript，您可以將 附加到人名，以匹配相同的報價長度並在該段落上留下text-align:center。然而，如果你引用了幾行，你將會遇到麻煩。

來源

2012-02-23 08:51:38 Christoph

仍在努力。段落是塊級元素。所以，即使它有一箇中心的文本對齊，不應該填充工作，或邊緣？ – Ray 2012-02-23 08:54:02

他們這樣做：http://jsfiddle.net/9KRjt/6/ – Christoph 2012-02-23 08:55:06

嗯。不知道爲什麼它對我沒有任何影響。我將不得不和你的jsfiddle一起玩，看看和我的代碼有什麼不同。 – Ray 2012-02-23 08:58:59

您可以像這樣使用CSS：p.caption {float：right}或{text-align：right}將其移動到右側;如果它沒用，可能會有一些代碼發生衝突。
如果要將塊元素堆疊起來，可以使用CSS position（和z-index）屬性。

來源

2012-02-23 08:59:53 Snger

css：文本對齊，邊距和填充如何一起工作

回答

相關問題