2014-01-11 51 views
-1

我在圖像周圍有文字 - bootply。 將img-thumbnail樣式應用於圖像時,文本顯示在右側,但當img-rounded或沒有樣式應用時,文本顯示在底部。Bootstrap 3 - 圖像周圍的文本對齊,同時保持圖像爲響應

img-rounded或沒有樣式應用時幫助向右顯示文本,保持img-responsive樣式。正如Mozilla Developer Network建議的,我嘗試了vertical-align,但它不起作用。

請幫助保護我們的隱私權政策。非常感謝!

+0

誰投下了票,可能沒有看到我提到:**保持'img-responsive'風格**。 – San

+1

在看到上面的評論後,其中一位下來的選民已經取消了,謝謝你。其他人,如果你可以解釋是什麼讓你失望,我會確保我今後糾正自己,如果我發現你的回覆很有價值。如果我不同意你的觀點,我不會爭辯,但你的回答會幫助我理解你的決定。提前致謝。 – San

回答

-1

我希望這個解決方案將幫助(也許不是完美的),但我認爲它會爲你工作, 顯示文字權當img-rounded只需重寫此類通過使值顯示,以inline-block的替代屬性塊。

代碼: 更改display: block;display: inline-block;在類img-rounded

然後你可以用div來包裝這個部分(圖片+段落)來定製兩者的外觀。

+0

我接受你的答案,因爲它給了我一個提示。實際上,'IMG'是一個內聯元素,'img-rounded'不會覆蓋'display'的樣式。它是'img-responsive',它聲明'display:block;'這對於響應式設備是有意義的。因爲顯而易見的原因,我不能重寫這個,所以我已經按照你的建議將img-rounded作爲內聯。再次感謝! – San

+0

很高興她解決了你的問題。 –