Question

我有一个div，其子div被连续三个对齐。儿童div的css：

{position:relative,float:left}

我使用这样的jQuery代码段：

$("#catalog-body").find("[data-"+ type +"='" + val + "']").hide();

效果很好，但可能会导致行间隙（代替隐藏的div）。如何使div重新调整？提前谢谢。

Answer 1

像这样改变你的元素结构。

<html>
<head>
    <style>

    #catalog-body{
        width : 300px;
    }

    .child-ele
    {
        float:left;
        width:90px;
        height:30px;
        border:1px red solid;
    }
    </style>
</head>
<body>

    <div id="catalog-body" >
        <div class="child-ele" >1</div>
        <div class="child-ele" >2</div>
        <div class="child-ele" >3</div>
        <div class="child-ele" >4</div>
        <div class="child-ele" style="display:none" >5</div>
        <div class="child-ele" >6</div>
        <div class="child-ele" >7</div>
        <div class="child-ele" >8</div>
        <div class="child-ele" >9</div>
        <div class="child-ele" >10</div>
    </div>
</body>
</html>

这是你应该得到的结果， enter image description here

隐藏第5个元素，但所有孩子都正确对齐

使用jquery重新排序元素

1 个答案: