0

我有这样的代码：

<div style="position:relative">
    <div style="float:left; width: 183px; background-color:#c1cba9; color: #000000;"><img border="0" alt="Product categories" title="Product categories" src="http://www.gvcdigital.co.uk/images/graphic/categrieshead.png" width="179" height="43"><br />
        <div style="margin-left: 10;"><ul><li><a href="/Digi-Spot/Sound-Vision-/_i.html?_sacat=293&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Sound &amp; Vision</a><span class="cnt"> (9943)</span></li><ul class="lev2"><li><a href="/Digi-Spot/TV-Home-Audio-Accessories-/_i.html?_sacat=14961&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">TV &amp; Home Audio Accessories</a><span class="cnt"> (4056)</span></li><li><a href="/Digi-Spot/Performance-DJ-Equipment-/_i.html?_sacat=48458&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Performance &amp; DJ Equipment</a><span class="cnt"> (1893)</span></li><li><a href="/Digi-Spot/Multipurpose-Batteries-Power-/_i.html?_sacat=48446&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Multipurpose Batteries &amp; Power</a><span class="cnt"> (1571)</span></li></ul><li class="morelnk"><a href="/Digi-Spot/Sound-Vision-/_i.html?_sacat=293&amp;_sasi=1&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">more...</a></li><li><a href="/Digi-Spot/Business-Office-Industrial-/_i.html?_sacat=12576&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Business, Office &amp; Industrial</a><span class="cnt"> (2530)</span></li><ul class="lev2"><li><a href="/Digi-Spot/Building-Materials-Supplies-/_i.html?_sacat=41498&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Building Materials &amp; Supplies</a><span class="cnt"> (2168)</span></li><li><a href="/Digi-Spot/Electrical-Test-Equipment-/_i.html?_sacat=92074&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Electrical &amp; Test Equipment</a><span class="cnt"> (107)</span></li><li><a href="/Digi-Spot/Industrial-Tools-/_i.html?_sacat=64808&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Industrial Tools</a><span class="cnt"> (92)</span></li></ul><li class="morelnk"><a href="/Digi-Spot/Business-Office-Industrial-/_i.html?_sacat=12576&amp;_sasi=1&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">more...</a></li><li><a href="/Digi-Spot/Computers-Tablets-Networking-/_i.html?_sacat=58058&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Computers/Tabl&#8203;ets &amp; Networking</a><span class="cnt"> (1655)</span></li><ul class="lev2"><li><a href="/Digi-Spot/Cables-Connectors-/_i.html?_sacat=31491&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Cables &amp; Connectors</a><span class="cnt"> (1328)</span></li><li><a href="/Digi-Spot/Laptop-Desktop-Accessories-/_i.html?_sacat=31530&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Laptop &amp; Desktop Accessories</a><span class="cnt"> (262)</span></li><li><a href="/Digi-Spot/Other-Computing-Networking-/_i.html?_sacat=162&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">Other Computing &amp; Networking</a><span class="cnt"> (33)</span></li></ul><li class="morelnk"><a href="/Digi-Spot/Computers-Tablets-Networking-/_i.html?_sacat=58058&amp;_sasi=1&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">more...</a></li></ul><div class="link"><br><a href="/Digi-Spot/_i.html?_sasi=1&amp;_sid=560455030&amp;_trksid=p4634.c0.m322">See all items in the store</a></div></div><br />
        <img border="0" src="http://www.gvcdigital.co.uk/images/graphic/catbot.png" width="179" height="17"></div>
    <div style="float:left; width: 480px; height:100px; text-align: center; background-color:#d6d6a4;"><img border="0" src="http://www.gvcdigital.co.uk/images/graphic/description.png" width="232" height="81"><br /><div style="text-align: left; margin-left: 10;">[[Description]]</div></div>
    <div style="float:left; width: 324px; height:100px; text-align: center; ">
        <div style="width: 324px; color: #ffffff; background-color:#6b8861; background-color:#d6d6a4;font-size : 34px;">[[Title]]</div>
        <div style="width: 324px; color: #ffffff; background-color:#6b8861;"><div style="width: 320px; margin: 2 2 2 2; background-color:#ffffff;">[[Picture1]]</div><div style="width: 300px; height: 2px; background-color:#6b8861; color: #6b8861;"></div></div>
        <div style="width: 324px; color: #801010; font-size : 40px; background-color:#d6d6a4;">Price: [[BuyItNowPrice]]</div>
    </div>
</div>

<div style="clear: both; text-aling: center; width:985px;"><img border="0" src="graphic/buttom.png" width="524" height="42"></div>

它的结果如下所示： 在此处输入图像描述

可能是什么问题呢？我希望用红色 div 标记的位于底部的中心。

4

4 回答 4

3

添加margin: 0 auto到该div：

<div style="clear: both; text-align: center; width:985px; margin: 0 auto;"><img border="0" src="graphic/buttom.png" width="524" height="42"></div>
于 2013-01-10T09:36:32.300 回答
2

在您的最终 div 中，您拥有text-aling: center而不是text-align: center.

于 2013-01-10T09:38:34.653 回答
1

添加边距：0自动；到那个标记的div。

于 2013-01-10T09:37:17.500 回答
1

你已经设置text-aling:center了它应该是什么时候text-align:center。修复它，您将获得位于 div 中心的图像。要使 div 本身居中，请添加margin: 0 auto到该 div

演示： http: //jsfiddle.net/8p7A2/1/添加了固定的文本对齐和边距。

于 2013-01-10T09:38:47.130 回答