BinaryDevelop
  1. ホーム
  2. css

[解決済み] margin: auto は中央揃えではありません。

2022-02-02 12:21:11

質問

ホームページの以下のスタイルで。 http://6.470.scripts.mit.edu/css_exercises/exercise4.html 

<style type="text/css">
  #sponsors {
         margin:auto;
         margin-top:50px;
         overflow: hidden;
         width: auto;
         display: inline-block;
  }
  div.image img {
         margin: 3px;
         border: 1px solid #ffffff;
  }
  div.image a:hover img {
        border: 1px solid;
  }
</style>
</head>
<body>
 <h1>Sponsors of 6.470</h1>
 <div id="sponsors">
   <div class="image"><a href=""><img src="images/appian.png" width="150" height="85"></a></div>
   <div class="image"><a href=""><img src="images/dropbox.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/facebook.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/nextjump.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/palantir.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/quora.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/tripadvisor.png" width="150px" height="85px"></a></div>
   <div class="image"><a href=""><img src="images/vecna.png" width="150px" height="85px"></a></div>
  </div>
</body>

もし width: auto から削除されます。 #sponsors とすると div#sponsors はセンターアライメントでないにもかかわらず margin: auto が使用されています。

同様に text-align: center を次のように置き換えます。 margin: auto を使用する場合、上記のボディスタイルでは <h1> が中央揃えにならないのはとんでもないことです。

を使用したため margin: auto を何度も使用し、問題なくコンテンツを中央に配置することができました。だから、私を助けて、私はこの多くに感謝します。

追記：Firefoxを使用し、さらに doctype タグで中央揃えすることはできません。 margin: auto .

解決方法は？

定義 width または margin を追加しました。 #sponsors ID

このように 

#sponsors{
margin:0 auto; // left margin is auto, right margin is auto , top and bottom margin is 0 set
width:1000px; // define your width according to your design 
}

詳細はこちら マージンオート

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します