jquery - html、jquery、css - 带有类型滑动表的商品目录（修改）

Question

需要帮助：
示例： http: //jsfiddle.net/JQaLs/1/
如何让商品没有下移？

使用时：

float:left;

它的移动

对不起，我的英语不好

补充1： 如果点击好，表格必须显示在下一行，但这一行的其他好必须在他们所在的地方。Maket 是橡胶，货物必须在某些行中占据一席之地。

补充2： “好”是“产品”

添加了 3： 我尝试尝试并希望查看如下：http: //jsfiddle.net/JQaLs/8/

display: inline-block;

完成： 我决定了这个问题：感谢 prerit ahuja 对 div-blocks 的想法。我用于

display: inline-block;

在 div ".models" 中，并将 div 添加到 ".types" 以供使用

display: inline-block;

也。

谢谢大家。示例见 jsfiddle.net/JQaLs/9/（我不能使用第三个“链接”，因为声誉低于 10）

Answer 1

由于表格结构，您的布局正在破坏，最好在 div 中创建布局

例如

<div>
<div><img src="product image"/></div>
<div>Description</div>
</div>

并且在 jquery 中而不是使用 $.after 使用 $.append 它将仅在主 div 中附加详细信息。

嗨，我已经更新了你要使用的结构，请参考http://jsfiddle.net/JQaLs/5/

<div class="models">
<a href="?10257" class="mod" id="10257">
<table >
<tr>
<td class="image"><img src="10257.jpg"></td></tr><tr><td class="desc"><b><span class="name">Товар 1</span></b><br><span class="years">2012.10 – Данный момент</span>
</td>
</tr>
</table>
</a>
</div>

并添加CSS

.models table
{
    width:100%;
}