0

可能是一个非常简单的问题，但我已经厌倦了试图自己实现这个问题。问题是我正在使用来自我们的软件产品的预先生成的 html 代码，因此不能只在 html 中将一个 div 移到另一个 div 之上。因此，我必须在 css 中完成。

  <div class="job_description">
    <h1>Web Developer (.Net/Mobile)</h1>
    <div class="job_summary">
       <p>
     Some text here
    <br>
    <br>
     Some text here
       </p>
    </div>

    <div class="job_classifications">
        <div class="classification x_location">
           <div class="class_type">Location</div>
           <div id="location" class="class_value"> London</div>
        </div>

         <div class="classification refno">
           <div class="class_type">Ref No</div>
           <div class="class_value">80</div>
        </div>
  </div>

基本上，我希望 job_classifications 出现在 job_summary 上方。然后在 job_classifications 中，我需要将每个不同的分类以网格格式一起显示。

有任何想法吗？

4

3 回答 3

1

像这样的东西可能会起作用，尽管它可能需要根据内容的外观进行一些调整。使用 jQuery：

$(".job_classifications").prependTo(".job_summary");

这是一个示例http://jsbin.com/aqukez/1/edit

于 2012-11-16T14:49:57.053 回答
0

将父 job_description 定位为相对，将子级定位为绝对应该会产生您正在寻找的效果。

这种方法的要点是针对最近的定位父定位位置。

于 2012-11-16T14:49:39.363 回答
0

http://jsfiddle.net/TxgKH/3/

您可以使用

.job_description {
   display: table;
   caption-side: bottom;
}
.job_summary {
   display: table-caption;
}

并为旧的 ie 定位绝对 + js 后备。

你可以做这样的事情 :) 对于低于 7 的 ie，有一个 js 后备。

于 2012-11-16T14:52:18.383 回答