[解決済み] Margin-Topで外側のdivを押し下げます。
2022-06-12 05:36:57
質問
wrapper divの最初の要素としてheader divを持っていますが、header divの中のh1にtop marginを追加するとheader div全体が下に押し出されてしまいます。この現象は、ページの最初に表示される要素にトップマージンを適用すると必ず起こりますね。
以下はサンプルコードです。ありがとうございます。
div#header{
width: 100%;
background-color: #eee;
position: relative;
}
div#header h1{
text-align: center;
width: 375px;
height: 50px;
margin: 50px auto;
font-size: 220%;
background: url('../../images/name_logo.png') no-repeat;
}
<div id="header">
<h1>Title</h1>
<ul id="navbar"></ul>
</div>
どのように解決するのか?
置く
overflow:auto
親もとに
div
このリンクで詳しく見る
関連
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] divをクリックすると、その下にある要素に移動します。
-
[解決済み] div' コンテナに合わせて画像を自動リサイズするにはどうしたらいいですか?
-
[解決済み] div 内の画像を縦に並べる方法
-
[解決済み] divの中のテキストを縦に揃えるにはどうしたらいいですか?
-
[解決済み] divの内容を下に揃える方法
-
[解決済み] クリアフィックスとは何ですか?
-
[解決済み] 親ディバイスの高さを指定せずに、子ディバイスの高さを100%にする方法は?
-
[解決済み] HTML5でminlengthの検証属性はありますか?
-
[解決済み】あるdivの上に別のdivを重ねる方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] cssのfit-contentで横幅を自動サイズ調整する
-
[解決済み] CSSでテキストを垂直方向にセンタリングするには?[重複しています]
-
[解決済み] <button> vs. <input type="button" />. Which to use?
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み] inline/inline-block要素間のスペースを削除するにはどうすればよいですか?
-
[解決済み] divブロック内のテキストを(水平方向と垂直方向に)センタリングするにはどうすればよいですか?
-
[解決済み] mailto:を使ってメールの件名や内容を設定することはできますか?
-
[解決済み] hr要素の色を変更する
-
[解決済み] 検索エンジンはAngularJSアプリケーションをどのように扱っているのか?
-
[解決済み] label要素の中にinput要素を入れるべきですか?