javascript - 水平对齐div，没有换行符

我有这个HTML：

<div id='container'>
  <div class='container-element' id='el0'></div>
  <div class='container-element' id='el1'></div>
</div>

我如何在没有换行符的情况下水平对齐“ container-element” div？

基本上，我最初只想查看元素“ el0”。
然后，如果我给左“ el0”做动画，我想查看“ el1”。

This是我的基本提琴，我找不到CSS组合来完成所需的工作。

最佳答案

这是你想要的？
我只是不去问您在查询中提到的内容：

单击两个水平对齐的DIV，它们会移动。在此处检查：http://jsfiddle.net/thePav/ZmjU5/18

的CSS

.wrapper {width: 504px; overflow: hidden}
#container {border: 1px solid #000; width: 1004px; overflow: hidden}
.container-element {border: 1px solid #f00; height: 200px; width: 500px; float: left}

的HTML

<div class="wrapper">
    <div id='container'>
        <div class='container-element' id='el0'>  </div>
        <div class='container-element' id='el1'>  </div>
    </div>
</div>

JS

$('.container-element').click(function(){
    $('#container').animate({
        marginLeft: -504
    }, 1000);
});

很粗糙，但这是一个基本想法。

关于javascript - 水平对齐div，没有换行符，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23760283/