how to put text around centered image?

Question

I am trying to accomplish something like this:

The can't seem to emulate the one above where the centered image is being surrounded by texts. I've tried using floats but something is just lacking and I have no idea what.

And this is what I currently have:

here is my code:

https://jsfiddle.net/eqs6e1db/

section{
 text-align: center;
}

section p{
-webkit-column-count: 3;
-moz-column-count: 3;
-ms-column-count: 3;
-o-column-count: 3;
column-count: 3;
text-align: justify;
}

section article:first-child{
float: left;
}

section article:last-child{
float: right;
}

Answer 1

Well, you can not achieve really your layout. But you can hack it a little bit.

For each column, you can set a spacer, a filler, and another spacer.

The first spacer reserves space from the top, just to push the filler to the required position. The filler really reserves the space. And the reamining spacer consumes the remaining space so that we go the other column.

You need to have a height set on the container

.base {
  width: 100%;
  height: 1000px;
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
}


.pushtop {
  background-color: rgba(200,0,0,0.2);
  width: 10px;
  height: 17%;
  float: right;
  clear: both;
}

.pushbottom {
  background-color: rgba(200,0,0,0.2);
  width: 10px;
  height: calc(83% - 200px);
  float: right;
  clear: both;
}

.insert {
  background-color: lightblue;
  height: 200px;
  clear: both;
  margin: 0px 10px;
}
.insertleft {
  width: 100px;
  float: right;
}

.insertcenter {
  width: 100%;
  float: right;
}

.insertright {
  width: 100px;
  float: left;
}

.container {
  width: 735px;
  position: relative;
}

.image {
  position: absolute;
  border: solid blue 1px;
  width: 485px;
  height: 200px;
  left: 123px;
  top: 170px;
  }

<div class="container">
<div class="image"></div>
<div class="base">

<div class="pushtop"></div>
<div class="insert insertleft"></div>
<div class="pushbottom"></div>
<div class="pushtop"></div>
<div class="insert insertcenter"></div>
<div class="pushbottom"></div>
<div class="pushtop"></div>
<div class="insert insertright"></div>
<div class="pushbottom"></div>
<p>Another 4-storey structure will soon be under construction to add new classrooms and laboratories for the High School and Grade School.</p> 
 
<p> Part of the reason for this attention to the North Campus is to help FU’s marketing strategy for the high school in response to the implementation of the K to 12 Program.  First, we want to attract more enrollees. Second, we invest in the facilities in our aim to increase not just the quality of our education but to boost our enrollment capacity from 700 students to 1500 students. And of Course, thanks to our new solar panel installation, we will also be providing all the new classrooms with air conditioning for those sweltering months.</p> 

<p>Corporate Social Responsibility or CSR, as viewed by the University, should also have a significant space in the academe's achievements and obligations.</p>

<p>Estudio Damgo, for instance, is now on its third iteration of touching people's lives through sustainable and life-changing architecture. Its buildings and designs, since its first project in 2013, serve as prototype structures that cater to the various needs of society. The University sees Estudio Damgo as a catalyst for creating a transformed, more developed, and more meaningful way of living not just in Dumaguete but through out the Philippines. Read more about the current project here. (note to Entheos; link the word “here” to full Estudio Damgo article)</p>

    <p>In terms of agriculture, FU's Aquaponics sets the example in the use of completely natural and organic farming techniques, which enhance not only the environment's safety but boost farmers' production capabilities and livelihood as well. Aquaponics provides agriculturists the answer to sustainable food production and a sustainable ecosystem for both fish and plants. For more specifics on our organic farm click here. (Note to Entheos: Link the word “here” to full organic farming article)</p>

<p>A forest and wildlife protection program called “Ayungon Forest Reserve” has also been pushed by the College of Arts and Sciences in partnership with local government units and the Department of the Environment and Natural Resources (DENR). The program calls for protecting the natural resources of the Reserve from causes of declining population, degradation of wildlife habitat, deterioration of soil and river quality, and the cave’s carrying capacity.</p>
 
<p>The College of Business Administration (CBA), on the other hand, is seriously pursuing a strong “Entrepreneurship Program” that caters to all levels of participants from students to MSMEs (Micro, Small, Medium Enterprises). In fact, the CBA in partnership with DTI will soon launch an “Entrep Hub”—a one-stop business center for start-up entrepreneurs—during the University Expo in which high school students will compete for the best business plan. The prize will be an Incubation Program for the winning plan to become a real business.</p>
 
<p>The University Expo, formerly the Digital Expo, of the College of Computer studies is a major University event that showcases innovative technology. The annual event, which includes robotic challenges, quiz bowls, film festivals, etc., is an avenue for students from different academic institutions to participate in and learn from the latest IT breakthroughs.</p>

<p>Barangay constituents also have the opportunity to learn computer skills such as basic PC operations, Internet use, word processing, spreadsheet and presentation through the university's Computer Literacy Program for adopted barangays.</p>

<p>Moreover, “The Queue” coffee shop, run by the College of Hospitality Management ‘s Culinary Arts students, draws customers from in and outside the campus because of its delicious food and beverages.</p>
 

 
</div>
  </div>

Note that the filler and spacer elements should not be visible. I have given the a background and a width (in the case of the push elements) so that you can see how it works