相关疑难解决方法(0)

我有一个div包装两列布局的古老问题.我的侧边栏是浮动的,所以我的容器div无法包装内容和侧边栏.

<div id="container">
  <div id="content"></div>
  <div id="sidebar"></div>
</div>

似乎有很多方法可以修复Firefox中的明确错误:

• <br clear="all"/>
• overflow:auto
• overflow:hidden

在我的情况下,唯一似乎正常工作的是<br clear="all"/>解决方案,这有点邋.. overflow:auto给我讨厌的滚动条,overflow:hidden肯定有副作用.此外,IE7显然不应该由于其不正确的行为而遭受这个问题,但在我的情况下,它与Firefox的痛苦相同.

目前我们可以采用哪种方法最强大？

我有一个小问题.我试图使用CSS并排对齐两个div,但是,我希望中心div位于页面的水平中心,我通过使用:

#page-wrap { margin 0 auto; }

这很好用.我希望第二个div位于中央页面包装的左侧,但我无法使用浮动设置这样做,尽管我确信这是可能的.

我想把红色的div放在白色div旁边.

这是我目前关于这两个div的CSS,侧栏是红色div,页面换行是白色div:

#sidebar {
    width: 200px;
    height: 400px;
    background: red;
    float: left;
}

#page-wrap {
    margin: 0 auto;
    width: 600px;
    background: #ffffff;
    height: 400px;
}

我需要将两个div相互对齐,这样每个div都包含一个标题和一个项目列表,类似于:

<div>
    <span>source list</span>
    <select size="10">
        <option />
        <option />
        <option />
    </select>
</div>

<div>
    <span>destination list</span>
    <select size="10">
        <option />
        <option />
        <option />
    </select>
</div>

使用表格非常容易,但我不想使用表格.我怎样才能做到这一点？

如何以同一"线"两个div块为中心？

第一个div:

<div id=bloc1><?php echo " version ".$version." Copyright &copy; All Rights Reserved."; ?></div>  

第二个div:

<div id=bloc2><img src="..."></div>

我有以下代码:

<div id="container">
    <div id="div1">Div 1</div>
    <div id="div2">Div 2</div>
</div>

我希望能够将#box1和#box2放在容器内的另一个旁边.容器居中

我一直试图让两个div并排浮动或基本上是购物车和物品(即jcart和cartbox),但似乎无法得到它.这是演示:链接

我尝试改变float:right;购物车css,但这只会将购物车向右移动,如果我移除购物车上的浮动css ..购物车和物品并排排列但由于某种原因,购物车看起来很小, "添加到购物车"按钮似乎没有点击.任何帮助将不胜感激!

HTML:

  <form method="post" action="" class="jcart">
    <fieldset>
      // item details here
    </fieldset>
  </form>

  <div class='cartbox'>
    <div id="jcart"><?php $jcart->display_cart();?></div>
    <div id='jcart-loader'><img src='img/ajax-loader.gif' alt=''></div>
  </div>

CSS:

#jcart {
position:relative;
font-size:1.15em;
top:0;
margin:0 0 .75em;
}

.jcart {
width:135px;
margin:0 20px 20px 0;
padding-top:20px;
border:solid 2px #E5E5E5;
float:left;
background:#F0F0F0;
text-align:center;
}

.cartbox {
float:left;
position:relative;
top:0;
width:500px;
margin:0;
padding:0;
}