如何解決css中float:right靠右對齊元素會換行不在同一條線上

來源:互聯網
上載者:User
這篇文章主要介紹了關於如何解決css中float:right靠右對齊元素會換行不在同一條線上,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下

使用float設定靠右對齊顯示的時候,我們通常會遇到,靠右對齊的元素會換行,這樣就會出現左右元素不在同一條線上,下面為大家介紹下兩種解決方案,有類似情況的朋友可以參考下

CSS中通常我們需要將某元素居左、居右顯示,這個時候我們就可以根據float來設定,在設定靠右對齊顯示的時候,我們通常會遇到,靠右對齊的元素會換行,這樣就會出現左右元素不在同一條線上,我們可以通過以下方式來解決這個問題:

第一種解決辦法:把左右對換,比如把日期放在標題的前面,對調一下就好了。

第二種解決辦法:給左邊也加上float:left。

CSS float定義和用法

float 屬性定義元素在哪個方向浮動。以往這個屬性總應用於映像,使文本圍繞在映像周圍,不過在 CSS 中,任何元素都可以浮動。浮動元素會產生一個塊級框,而不論它本身是何種元素。

如果浮動非替換元素,則要指定一個明確的寬度;否則,它們會儘可能地窄.

Float常跟屬性值left、right、none
Float:none 不使用浮動
Float:left 靠左浮動
Float:right 靠右浮動

以上就是本文的全部內容,希望對大家的學習有所協助,更多相關內容請關注topic.alibabacloud.com!

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.