我需要帮助将3列表放入div中

时间:2014-02-13 19:18:02

标签: jquery css html-table

我真的很擅长HTML和所有这些东西,所以我需要具体细节。所以我的问题是:如何将我的3列表放入我已经存在的div而不会改变太多?

我到目前为止的代码如下所示,我试图将表格放在:

<div style="border:2px solid white;width:700px;height:350px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;display:table;"><u><b><font color=#EC008B><font size=5>MEASUREMENTS IN INCHES</u></b></font color=#EC008B></font size=5><br>

<table border="0" cellpadding="5" cellspacing="0" width="600">

<tr><td align="left" valign="top" width="200">

MEASUREMENTS

</td><td align="left" valign="top" width="200">

MEASUREMENTS

</td><td align="left" valign="top" width="200">

IMAGE WILL GO HERE

</td></tr></table>

</div>

但无论如何,3列表出现在div而不是IN中,我不知道如何修复它。我有一张关于它正在做什么的图像,但我无法发布,所以如果你想看到它,请告诉我。

这也适用于Ebay。它确实改变了一些事情,但我认为它不会影响这个特定的div,但我想我会告诉你。

更新:

转到practiceboard.com并输入此代码,这是我到目前为止所做的:

<table> <tr><td style="padding: 0px"><table bgcolor="#DAEBC6" border="0" width="800"     align="center" cellspacing="0"><tr><td width="800" background="http://i1373.photobucket.com/albums/ag383/Dixie_Stockwell/cleanbg1000x1000-01_zpsf98a4ebc.png" style="background-repeat: yes- repeat; padding: 0px"><center><img style="height:auto; width:auto; max-width:600px; max-height:600px;" src="http://i1373.photobucket.com/albums/ag383/Dixie_Stockwell/smallernetsukegirllogo-01_zpsc05c6cff.png"></center><img border="0" src="" width="1" height="10"><div align="center"><table border="0" cellspacing="0" bgcolor="#90C382" align="center"> <div style="border:2px solid white;width:700px;height:175px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;"><u><b><font color=#EC008B><font size=5>THINGS TO KNOW</u></b></font color=#EC008B></font size=5> <br><span style="height:100%;" align="left"><font size=3><font color=white><ul><li>Label sizes may vary from designer to designer and from decade to decade. Please use measurements for accurate sizing.</li><li>Garments are pre-owned and have been laundered, which may have caused shrinkage from original size.</li><li>Measurements are taken in inches and may be within a half inch of listed measurements.</li><li>All flaws will be identified and listed in the description.</li></ul></span></div><div style="border:2px solid white;width:700px;height:175px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;"><u><b><font color=#EC008B><font size=5>ABOUT</u></b></font color=#EC008B></font size=5><br><p style="height:100%;" align="center">POST ABOUT ITEM HERE </p></div>
<div style="border:2px solid white;width:700px;height:350px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;"><u><b><font color=#EC008B><font size=5>MEASUREMENTS IN INCHES</u></b></font color=#EC008B></font size=5><br>

<table border="0" cellpadding="5" cellspacing="0" width="600">
<tr><td align="left" valign="top" width="200">

PUT FIRST COLUMN CONTENTS HERE

</td><td align="left" valign="top" width="200">

PUT SECOND COLUMN CONTENTS HERE

</td><td align="left" valign="top" width="200">

PUT THIRD COLUMN CONTENTS HERE

</td></tr></table>



<div style="border:2px solid white;width:700px;height:175px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;"><u><b><font color=#EC008B><font size=5>SHIPPING</u></b></font color=#EC008B></font size=5><br><p style="height:100%;">Shipping takes place on Mondays, Wednesdays, and Fridays after payment is received.<br>All items will be shipped via USPS Priority Packaging.</p></div><div style="border:2px solid white;width:700px;height:175px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;"><u><b><font color=#EC008B><font size=5>POLICY</u></b></font color=#EC008B></font size=5><br><p style="height:100%;">&emsp;We take pride in our vintage clothing collection. All Items are cleaned, pressed, and ready for wear. We strive to give the best quality on our garments.<br><font color=#EC008B>&#38;hearts;</font color=#EC008B><br>The finest in vintage apparel<br><b><font size=4>Everything else is just used clothing.</b></font size=4></p></div><img border="0" src="" width="1" height="30"><div align="center"><table border="0" cellspacing="0" bgcolor="#90C382" align="center"></div></td></tr></table></td></tr></table></td></tr></table></div></td></tr></table></div>

2 个答案:

答案 0 :(得分:1)

您需要修改HTML,如下所示:

<div style="border:2px solid white;width:700px;height:350px;overflow:scroll;overflow-y:scroll;overflow-x:hidden;background-color:#90C382;display:table;"> 
<u>
    <b>
        <font color=#EC008B>
            <font size=5>MEASUREMENTS IN INCHES</font>
        </font>
    </b>
</u>
<br />
<table border="0" cellpadding="5" cellspacing="0" width="600">
    <tr>
        <td align="left" valign="top" width="200">MEASUREMENTS</td>
        <td align="left" valign="top" width="200">MEASUREMENTS</td>
        <td align="left" valign="top" width="200">IMAGE WILL GO HERE</td>
    </tr>
</table>

您随机打开和关闭标签。例如,您的代码有:

<u>
    <b>
        <font color=#EC008B>
            <font size=5>MEASUREMENTS IN INCHES
            </u>
        </b>
    </font color=#EC008B>
</font size=5>

这是不正确的HTML,如果您打开标记<u>,则必须将其关闭 AFTER 内部的所有其他标记都已关闭。所以你的代码应该是这样的:

<u>
    <b>
        <font color=#EC008B>
            <font size=5>MEASUREMENTS IN INCHES</font>
        </font>
    </b>
</u>

同样,当您关闭代码(</font>)时,无法在其中应用属性。举个例子,你不能这样做:

</font color=#EC008B>
    </font size=5>

修改 修复了你的标记:http://jsfiddle.net/tsecn/4/

答案 1 :(得分:0)

您的语法看起来正确。有点时髦但正确。 Ebay的HTML编辑器可能正在删除内容,你有一个URL,以便我们可以查看帖子吗?