もうナンセンスじゃない、郵便番号 HTML部分 <div class="positionleft">私はポジションメソッドの左側にいて、30%を占めています</div> <div class="positionright">私は位置メソッドの右側にいて、70%を占めています</div> CSS部分 .positionleft{ 位置: 相対的; 表示: インラインブロック; 背景色: #8d8d8d; 幅: 30%; 高さ: 20%; } .positionright { 位置: 相対的; 表示: インラインブロック; 左: 0; 背景色: #ff8888; 幅: 70%; 高さ: 20%; } 表示効果 2 つの div ブロックの位置がずれていることがはっきりとわかります。情報を調べてみると、この現象は 2 つのインライン ブロックの間にスペースがある場合に発生することがわかります。 HTMLコードを次のように変更します <div class="positionleft">私はポジションメソッドの左側にいて、30%を占めています</div> <div class="positionright">私はポジションメソッドの右側にいて、70%を占めています </div> 2 つの div 間のスペースを削除して、効果を確認してください。 問題解決 Prettierなどの文書フォーマットツールを使用する場合は、この問題に注意してください。 要約する インラインブロックの位置ずれ問題をCSSで解決する方法についての記事はこれで終わりです。CSSインラインブロックの位置ずれに関する関連コンテンツについては、123WORDPRESS.COMの過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも123WORDPRESS.COMをよろしくお願いいたします。 |
<<: JS クロスドメイン XML - AS URLLoader を使用
>>: Vue の匿名スロットと名前付きスロットの詳細な説明
この記事では、主要な CSS ウェブサイトで推奨されている 20 個の便利なルールとベスト プラクテ...
VIP を設定した後、アクティブ/スタンバイの切り替え中に表示されるエラー メッセージは次のとおりで...
序文WeChat アプレット開発 (ネイティブ wxml、wxcss) で、{{ }} 内で直接メソ...
Docker は、あらゆるアプリケーション用の軽量でポータブルな自己完結型コンテナーを簡単に作成で...
Vue ルーティング this.route.push ジャンプ ページが更新されない1. 背景概要:...
img src 値が空の場合、リクエストが 2 つ行われます。一部の学生は以前に同様の状況に遭遇した...
1. ゴミかクラシックか? Web テクノロジーは急速に更新されており、Web サイトのインターフェ...
この記事では、Ubuntu18.04にmysql5.7.23をインストールする具体的な方法を参考まで...
序文皆さんは Linux で top コマンドを使ったことがあると思います。私は Linux に触れ...
序文最近、小さなプログラムを開発しているときに、このような問題に遭遇しました。ユーザーが認証をクリッ...
先週末、兄弟プロジェクトはより良いサービスを提供するためにサーバーを拡張する準備をしていました。兄弟...
目次1. オブジェクトのプロパティ1.1 属性表記2. プロパティ名を計算する3.オブジェクトメソッ...
MySQL データベースでは、テーブルが互いに関連付けられた後は、それらを任意に削除することはできま...
まず第一に、この効果は古い話題であるはずだということはわかっています。今日ファイルを整理していたら、...
1. はじめに少し前、開発者がテスト環境や本番環境で誤った操作をし、データベースを誤って削除/更新し...