Question

我的页面上有div。有div .rightColumnBar和.divAttributes 的 HTML

    <div class="mainContent">
<div class="pageContent">

<form id="createLead" class="frmDiv clear" action="/leads/create_lead.html?lead_id=3287" name="createLead" method="post">

<div class="divEditLead sldf_columnsContainer">
<div id="hot_div">
<div id="errorBlock">
<div class="leftColumnBr">
<div class="centerColumnBr">
<div class="rightColumnBr">
</div>

<div class="createLeadButtons">
<input id="saveLeadBtn" class="bigButton redButton" name="save" value="Save" type="submit">
</div>

</form>
</div>
<div class="divAttributes frmDiv">
<div id="specHeightIncreaser"></div>
</div>

CSS

  .divAttributes {
      border: 1px solid #d1ddd4;
      min-height: 200px;
      padding-top: 10px;
      width: 280px;
    }
    .rightColumnBr {
    float: left;
    margin-top: 15px;
    width: 377px;
    }

我如何移动（仅用于前面，而不是作为html元素插入）rightColumnBr到divAttributes并为div中的divAttributes浮动属性设置？

感谢。

Answer 1

如果你是瞄准脚本，那么你可以用这种方式进行CSS更改和DOM操作：

＆＃13;

$('.divAttributes').css({
	'border-color': 'red'
}).after( $('.rightColumnBr') );

＆＃13;

.divAttributes {
    border: 1px solid #d1ddd4;
    min-height: 100px;
    padding-top: 10px;
    width: 280px;
}

.rightColumnBr {
    float: left;
    margin-top: 15px;
    width: 377px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pageContent">
    <div class="rightColumnBr">
        RCB
    </div>
    <p>
        Text
    </p>
    <div class="divAttributes frmDiv">
        ATTR
    </div>
</div>

＆＃13;

同样在JSFiddle。

Answer 2

这是你想要的吗？

<div class="pageContent">
    <form id="createLead" class="frmDiv clear">
        <div class="divEditLead sldf_columnsContainer">
        </div>
        <div class="leftColumnBr">
        </div>
        <div class="centerColumnBr">
        </div>

        <div class="createLeadButtons">
        </div>
    </form>
</div>
<div class="divAttributes frmDiv">
</div>
<div class="rightColumnBr">
</div>


.divAttributes {
    border: 1px solid #d1ddd4;
    min-height: 200px;
    padding-top: 0px;
    width: 200px;
    float:left;
}
.rightColumnBr {
    border: 1px solid #d1ddd4;
    float: left;
    margin-top: 0px;
    width:200px;
    height:200px;
}

另请通过jsfiddle链接：https://jsfiddle.net/mayurdandekar/0soLrqv0/

在另一个div（near）之后移动一个div并设置float属性

2 个答案: