ホームページ  >  記事  >  ウェブフロントエンド  >  CSS の float:right 右揃え要素が折り返されて同じ行にない問題を解決する方法

CSS の float:right 右揃え要素が折り返されて同じ行にない問題を解決する方法

不言
不言オリジナル
2018-06-21 17:35:233102ブラウズ

この記事では、CSS の float:right 右揃え要素が別の行で折り返される問題を解決する方法を主に紹介します。必要な友達に参考にしてもらいます。 float で右揃えに設定する 表示を整列させると、通常、右揃えの要素が折り返されて、左と右の要素が同じ行に並ばなくなることがあります。同じような状況に陥った友人が参考にできる解決策を 2 つ紹介します。 CSS では、通常、要素を左また​​は右に表示する必要があります。このとき、右寄せ表示を設定する場合、通常、要素は右寄せに設定されます。要素が同じ行に表示されないようにラップします。この問題は次の方法で解決できます。

最初の解決策:

例えば、タイトルの前の日付を入れ替えるだけです。

2 番目の解決策: float:left を左側にも追加します。

CSS float の定義と使用法

float 属性は、要素がどの方向に浮動するかを定義します。歴史的に、このプロパティは常に画像に適用され、テキストが画像の周りを回り込むようにしていましたが、CSS では任意の要素をフローティングにすることができます。フローティング要素は、要素のタイプに関係なく、ブロック レベルのボックスを作成します。 非置換要素をフロート化する場合は、明示的な幅を指定します。それ以外の場合は、できるだけ狭くなります。

Float の後には属性値 left、right、none が続きます。

Float:none はそうではありません。 float を使用します

Float:left Float

Float:right Float to the right


以上がこの記事の全内容です。その他の関連コンテンツについては、PHP 中国語 Web サイトをご覧ください。 !

関連する推奨事項:

css 属性 nth-child(n) を使用して n 番目の子要素を照合して選択する方法

offsetHeight を使用して高さを取得するときに Firefox が 0 になる問題を解決する方法div


以上がCSS の float:right 右揃え要素が折り返されて同じ行にない問題を解決する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。