Various CSS attributes can be used to align elements in different ways, and here are some examples:
To achieve your goal, you can utilize float, display inline-block, or table-cell (although less common). Another option is flexbox, which is not covered here but is worth exploring.
It's important to remember that "divs" are block elements, so using inline-block is usually a better choice over inline. Inline-block allows for vertical margin/padding properties (top, bottom) while still maintaining some of the characteristics of inline elements.
Check out the code on jsFiddle
<div class="method method-float">
<div class="design-image">
<img src="https://s29.postimg.org/taqtdfe7r/image1.png">
</div>
<div class="programs">
<p>Method float <br>Taking the approach of truly designing programs from ground up, Northman Underwrites each individual to reflect the unique exposure of an extraordinary life. </p>
</div>
</div>
<div class="method method-inline-block">
<div class="design-image">
<img src="https://s29.postimg.org/taqtdfe7r/image1.png">
</div>
<div class="programs">
<p>Method inline-block <br>Taking the approach of truly designing programs from ground up, Northman Underwrites each individual to reflect the unique exposure of an extraordinary life. </p>
</div>
</div>
<div class="method method-table-cell">
<div class="design-image">
<img src="https://s29.postimg.org/taqtdfe7r/image1.png">
</div>
<div class="programs">
<p>Method display table cell (not commonly used, but an interesting technique to know) <br>Taking the approach of truly designing programs from ground up, Northman Underwrites each individual to reflect the unique exposure of an extraordinary life. </p>
</div>
</div>
CSS
img {
width: 100%;
height: auto;
}
.method-float {
overflow: hidden;
}
.method-float .design-image {
float: left;
width: 50%;
}
.method-float .programs {
float: left;
width: 50%;
}
.method-inline-block {
font-size: 0;
}
.method-inline-block .design-image {
display: inline-block;
width: 50%;
vertical-align: top;
}
.method-inline-block .programs {
display: inline-block;
width: 50%;
vertical-align: top;
font-size: 16px;
}
.method-table-cell .design-image {
display: table-cell;
width: 1%;
vertical-align: top;
}
.method-table-cell .programs {
display: table-cell;
width: 1%;
vertical-align: top;
}