css - 只有三个元素中的一个元素对齐是正确的

Question

这是代码：

    <style type="text/css">
    body { background: #0c2660; padding: 0px; margin: 0 auto; width: 550; align: center;}
    .logo {text-align: center; margin: 90px 0;  position: relative;}
    .mapper {margin: 0; position: relative;}
    #back { background: #0c2660 url('back.jpg') no-repeat; margin: 0px; width: 1024; height: 768px; text-align: center;}
</style>    

以及有图像映射的html

<div id="back">
<div class="logo"><img src="logo.png" width="331" height="74" border="0" alt="" /></div>
<div class="mapper"><img src="greece.png" width="550" height="500" border="0" usemap="#map" class="mapper iborder00aa00 icolor00ff00" alt="" />
<map name="map"></map>
</div>
</div>

只有徽标图像按应有的方式在中心对齐，无论我更改什么，背景图像和greece.png都向左对齐

Answer 1

您可以从中删除宽度<div id="back">以使其居中

Answer 2

body { 
   background: #0c2660; 
   padding: 0px; 
   margin: 0 auto; 
   width: 1024px;
} 
.logo { 
   text-align: center; 
   margin: 90px 0; 
   position: relative; 
}
#mapperi { 
   margin-left: 240px; 
   position: relative; 
   align: middle;
}
#back { 
   background: #0c2660 url('back.jpg') no-repeat; 
   margin: 0px; 
   height: 768px; 
   text-align: center;
}

是最终的解决方案:)