保证金:汽车不居中

Md.*_*rim 16 css

来自网站的以下风格: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>
Run Code Online (Sandbox Code Playgroud)

如果width: auto从删除#sponsors,则div#sponsors没有居中对齐,即使margin: auto使用.

同样地,如果不是text-align: centermargin: auto上面的体型代替,那么<h1>它将不是中心对齐的,这是荒谬的;

因为我已经使用margin: auto了很多次,它能够毫无问题地集中内容.因此,帮助我,我会很感激这一点.

PS:我使用的是Firefox,除了使用doctype标签之外,它仍然无法集中margin: auto.

Roh*_*zad 7

定义widthmargin在您的#sponsorsID上

像这样

#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 
}
Run Code Online (Sandbox Code Playgroud)

更多关于保证金自动