- みんなの回答 （1）
- 専門家の回答
みんなの回答
- grumpy_the_dwarf
- ベストアンサー率48% (1628/3337)
関連するQ&A
- ホームページ margin
#test1 { width: 443px; height:58px; position: top; margin: -1px 538px 8px ; } #test2 { width: 289px; height:59px; position: top; margin: -1px 1238px 8px ; } （画像はヘッダー部分です。） この二つはどちらも上下のmarginは同じ数値にしてあるのになぜ赤はこんなにも下にさがるのでしょうか？ 赤を青の場所に持ってきたいのですがどうすればいいでしょうか？
- ベストアンサー
- CSS
- marginが効いてくれません。
下記のレイアウトで#contentsのmarginを上下左右10pxで指定していますが、Fierfoxで見るとbottomだけmarginが効いてくれません。 #contentsには背景画像を持ってきたいので、下のmarginがとれないと困っています。 よろしくお願いします。 body { margin: 0px; padding: 0px; text-align: center; } #wrap { padding: 0px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; width: 800px; text-align: left; } #header { background: #0099CC; width: 800px; } #contents { padding: 0px; width: 800px; margin: 10px; } #contents #sidenavi { background: #CCCCCC; width: 160px; float: left; } #contents #main { background: #FFFFCC; width: 580px; float: right; } #footer { background: #99CCFF; height: 80px; width: 800px; clear: both; } p{ margin: 0px; padding: 0px; } ****************************HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>Layout01</title> <style type="text/css" media="all"> @import url("Layout1.css"); </style> </head> <body> <div id="wrap"> <div id="header"> <h1>Layout</h1> </div> <div id="contents"> <div id="sidenavi">内容がここに入ります</div> <div id="main"> <p>内容がここに入ります</p> </div> </div> <div id="footer">内容がここに入ります</div> </div> </body> </html>
- ベストアンサー
- HTML
- marginの相殺ではないのに、margin-topが効かない
marginの相殺ではないのに、margin-topが効かない 状態です。 <h2 class="a">見出しa</h2> <div><!--外枠-->ここにclearfix <div><img></div>ここでfloat:left <div><img></div>ここでflaot:left <div><img></div> </div> <h2 class="b">見出しb</h2><!--この<h2>のmargin-topが効かない-->ここでclear:both; <div><img></div> <div><img></div> <div><img></div> </div> なぜmarginの相殺ではないのに2個目の<h2>でmargin-topが効かないのでしょうか？ 教えてください・ よろしくお願い申し上げます。
- 締切済み
- HTML
- CSSでmargin-left: -20px;という記述はありですか？
ulの●の部分がどうしても左にレイアウトされてしまうので、ul部分を全体的に右に動かしたいと思っています。 しかし下記のようにマイマスをつかいことぐらいしか思いつきませんでした。 文法上？これは問題ないのでしょうか。 また、他に良い方法があったら教えてください。 div#content ul { margin-left: -20px; margin-bottom: 1em; margin-right: 20px; margin-left:1em; }
- ベストアンサー
- CSS
- 同じIE8なのに機種によってmarginが効かない
Mac OS Xで自サイトを制作しています。 Windows XPもあるので、確認しているのですが、その限りではおかしい所は見当たりません。 ところが、他の方のWindowsで見た時に、marginが効かずに、ヘーダーのdivとインナーのdivがぴったりとくっついてしまっている部分があります。 いろんなWindowsで見て、全てIE8で確認しているのですが、機種によって（？）離れたりくっついたりと違いが出ます。 効くものは効くし、効かないものは効かないという感じです。 ブラウザの種類やバージョンの違いでこうなるのはまだ分かるのですが、同じIE8で見ているのにこのような違いが出るのはなぜなのでしょうか？ また、この問題を解消して、ちゃんとスペースが空くようにするには、どこを変えると良いのでしょうか？ 自分のWindows環境ではちゃんと表示されているので治すに治せません。 ご教示お願いします。 body { margin: 0; } #wrap { width:802px; margin:0 auto; } #header { padding:16px; } #inner { margin:16px 0; padding:0 8px; } #footer { padding:16px; } 背景色指定など、直接関係しないものは省略しています。 <body> <div id="wrap"> <div id="header">ヘッダー部分</div> <div id="inner">インナー（サイトのメイン）部分</div> <div id="footer">フッター部分</div> </div> </body> inner側でmarginを上下に設定しているのが問題なのでしょうか。 しかし、それでもinnerとfooterの間はちゃんと16px分空いているのです。 なのに、headerとinner側に限って空いたりくっついたりするというのが分かりません。
- ベストアンサー
- ブラウザ
- cssのmarginについて教えてください
cssのmarginについて教えてください cssを使い、一般的な1カラムのサイトを制作しています。 外枠を組む所までは上手く行ったのですが 中身を入れるとfirefoxで表示した時、上部分に変な余白が出てしまいました。 IE7では問題なく表示されます。 色々と試した結果、中の要素のmargin（下記におけるdiv#header pの部分）が 外枠にも影響を及ぼしているんだろうと予測しているのですが、対処方法が解りません。 （この場合、headerの上部に30pxの空白が出来てしまいます。main等で試しても同じことになりました。） marginを0にする、または<p>や<div>で囲わずに「あいうえお」と書けば余白は出ないのですが、そういう訳にもいかず・・・。 試しに<h1>で囲んだり、idではなくclassで囲んでみたりしたのですが結果は変わらず、 <div>ではなく<span>で囲むと余白はでない変わりにmargin自体が無効状態になってしまいました。 それともこういう場合、div#header p部分のmarginがdiv#headerにも適用されるのは当たり前の事で、私の考え方が間違えているのでしょうか？ div#header pのmarginが影響してるのだとしても、上にだけ影響が出て左右には影響がないことにも首をひねっています。 独学でやってきたので曖昧な部分が多く、質問も上手く文章に出来ず申し訳ないのですが 詳しい方がいらっしゃいましたら、どうぞよろしくお願いします。 ---------------------------------------------------------------------- div#box {background-color: #ffffff ; width : 850px ; margin : 0 auto ; min-height: 100% ; position:relative ;} div#header {background-image: url(image/back-header.gif) ; width : 850px ; height : 90px ;} div#menu {background-image: url(image/back-menu.gif) ; width : 850px ; height : 45px ;} div#main {background-image: url(image/back-main.gif) ; background-repeat: no-repeat ; background-position: top ; width : 850px ; padding-bottom: 25px ;} div#footer {background-image: url(image/back-footer.gif) ; width : 850px ; height : 25px ; position: absolute ; bottom: 0px ; } --------------------------------------------- div#header p {font-size : 0.9em ; margin: 30px ;} ---------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <body> <div id="box"> <div id="header"><p>あいうえお</p></div> <div id="menu">省略</div> <div id="main">省略</div> <div id="footer">省略</div> </div>
- ベストアンサー
- HTML
- 水滸伝の英訳、 Water Margin の margin の意味
水滸伝の英訳は Water Margin だそうですが、この margin の意味はなんでしょうか？水辺の辺の意味でしょうか？だとしたら中国のどこの場所を指すの？それとも margin の別の意味でしょうか？
- ベストアンサー
- 英語
- marginやpaddingなどの使いすぎ
marginやpaddingなどの使いすぎって駄目ですか？ 出来るだけ使わないようにしているのですが、どうしても多用してしまいます。 あまり使いすぎない方がいいのでしょうか？
- ベストアンサー
- CSS
- MFC-J820DNのFAXができなくなりました。メニューボタンを押して、接続確認のボタンを押すと、通信ボックスとの接続は正常ですと表示されますが、FAXを送ろうとすると通信ボックスと接続中ですとの画面になり、操作出来ませんとのエラーメッセージが表示されます。通信ボックスのリセットを試しても修復できず、FAXのみができません。パソコンからのコピーやスキャンは正常にできます。
- パソコンはWindows10を使用しており、MFC-J820DNは有線LANで接続されています。Wi-Fiルーターの機種名は特記していません。関連するソフト・アプリについても具体的な情報は提供されていません。
- 使用している電話回線はひかり回線です。
