0

我正在创建一个用于 eBay 列表的模板。我添加了一个侧边栏以浮动到正文的右侧。但是，当我将源代码复制到 eBay 列表中时，它会从正文中移开，留下空白。我如何做到这一点，以便无论正文框的宽度是多少，侧边栏都将紧贴在它的右侧。

我是编码的初学者，我知道我刚才问的可能没有任何意义，但我已经包含了下面的代码，如果你在浏览器中全屏打开它，你会明白我的意思。

<head>
   <div id="pdcontainer">    
<style>    
 #pdcontainer {
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
    }

 #sidebar { 
       position:relative; float:right; width:175px;
       min-height:2450px;border:5px solid #66CCFF;
    }    
 body{margin:0;padding:0;width:500px;height:2455px;border:5px solid #66CCFF;"}

</style>

</head>

<body>
    <div id="sidebar">
      <br/><br/><br/><b><font size=+1><center></center></font></b><br/><br/><br/>
    </div>

    <div id="body"> Testfffffffffff <br/>
    </div>

</body>
4

2 回答 2

0

一个问题可能是这一行：

<div id="sidebar">
 <br/><br/><br/><b><font size=+1><center></b></font></center><br/><br/><br/>
</div>

这不是格式正确的 -<font>标签在开始和结束<center>标签内关闭 - 我强烈建议您避免使用字体和中心标签，但如果您必须使用它们，请尝试以下操作：

<div id="sidebar">
  <br/><br/><br/><b><font size=+1><center></center></font></b><br/><br/><br/>
</div>

<font>你可以使用 CSS " font-size" 属性来代替。而不是<center>你可以使用text-align: center.

此外，您应该将<div>元素的样式设置为position: relative;

于 2013-04-25T23:20:16.340 回答
0

这就是你所追求的吗？

jsfiddle：http: //jsfiddle.net/vdZGL/1/

您需要处理代码的格式和结构。特别是如果您一开始使用模板，请保持简单和干净。

这是我所做的：

我已将您的重命名<div id="body">为<div id="content">（因为它更符合逻辑）。

#sidebar正确地将和#contentdiv包装在#pdcontainerdiv 中。

复制您应用到 的所有样式，<body>并将它们放置在 的新样式中#content。

用于position:relative;和div 。float:left;_#content#sidebar

编辑：另请注意，您的标签不应包含html代码<head>。

例如<div id="pdcontainer">，您的<head>标签中有该行。确保删除此行并按照上面的 jsfiddle 进行操作。

于 2013-04-26T02:14:16.167 回答