兩個 css3 列文本，中間有一個圖像

Question

我想達到這個結果

有很多的教程圍繞這樣的，但他們有一個固定的文本和列工作。 我以這種方式在我的兩列布局中打印可變長度文本

#cols {
column-count: 2;
column-gap: 20px;
}

<div id="box">
  <p id="cols">
    Lorem Ipsum....
  </p>
</div>

所以我不能使用這樣的技術，在這種情況下如何將圖像放在中間？

Answer 1

這個給你：
http://jsfiddle.net/aX47K/

css：

.column{  
   width:300px;  
   float:left;  
   margin-right:20px;  
} 

.column div{  
  width:200px;  
  height:210px;  
}

#col-1 div{
  float:right;
}
#col-2 div{
 float:left;
} 

img#center-image{  
  position:absolute;  
  left:110px;
}