0

我有这样的html代码:

<body style="text-align: center;">
<div style="background-color: #014156; text-align: center; width: 985px; margin:6px auto;">
<div style="background-color: #a6a6a6; width: 975px; background-image:url('shadow.gif'); background-repeat:repeat-x; background-position: center top; margin: 6px; overflow:hidden;">
<div style="float:left; width: 674px; text-align: center; color:#056c02; margin-left: 5px; margin-top: 10px; font-size: 20opx;" title="Product title"><span style="color: #d2ff00">"</span><span style="background-color: #d2ff00">[[Title]]</span><span style="color: #d2ff00">"</span><p style="text-align: left; font-size: 14px; margin-bottom: 5px;" title="Description">[[Description]]</p></div>
<div style="float:left; width: 301px; text-align: center; " title="General information (Image, stock, price)">[[Picture1]]<BR><SPAN style="FONT-SIZE: 9px; background-color: #FFFFFF;">Image is for illustrative purposes only. Please refer to product description.</SPAN></div>
</div>

结果:

在此处输入图像描述

在灰色背景的 div 中,我需要两个 div 对齐内联,结果将是这样的: 在此处输入图像描述

我应该改变什么,问题出在哪里?

Ps 我的样式在标签中进行了描述,因为由于某些主机原因,我无法为此使用 css。所以请不要开始告诉我这件事:)

4

3 回答 3

1

您需要降低左 div 或右 div 的宽度。

例如,降低第一个 div 可以650px解决问题。

您的逻辑是正确的:674px + 301px 确实等于 975px,但您没有考虑这些值中的边距、填充和边框。使“真实”宽度小于或等于 975px

于 2013-02-27T16:14:35.440 回答
0

而不是float: left,尝试使用display: inline-block,应该可以。

于 2013-02-27T16:13:51.740 回答
0

你有一个p标签,它是在blockinline 旁边排列的span。根据您的要求添加inline或添加inline-block到标签中。p另一种可能性是您可以将 更改pspan.

于 2013-02-27T16:15:08.093 回答