How to give spacing in between columns of bootstrap grid - twitter-bootstrap-3

Question

I'am using code pen website for quick preview and using it's bootstrap maybe version 3
<div class="container-fluid">
<div class="jumbotron">
<h1 class="text-center">Mohandas Karamchand Gandhi</h1>
<h2 Class="text-center text-muted">Mahatma Gandhi</h2>
<div class="img-thumbnail img-fluid text-center"><img src="http://school.eckovation.com/wp-content/uploads/2017/03/gandhi.jpg" width="1415px">
<div class="caption"><em>Mahatma Gandhi was the primary leader of India’s independence movement and also the architect of a form of non-violent civil disobedience that would influence the world.</em></div>
</div>
<br>
Using bootstrap's grid system
<div class="row">
<div class="card col-md-4">
<div class="card-body">
<h4 class="card-title">Who Was Mahatma Gandhi?</h4>
<p class="card-text">Mahatma Gandhi (October 2, 1869 to January 30, 1948) was the leader of India’s non-violent independence movement against British rule and in South Africa who advocated for the civil rights of Indians. Born in Porbandar, India, Gandhi studied law and organized boycotts against British institutions in peaceful forms of civil disobedience. He was killed by a fanatic in 1948.</p>
</div>
</div>
Want spacing in-between here
<div class="card col-md-4">
<div class="card-body">
<h4 class="card-title">Religion and Beliefs</h4>
<p class="card-text">Gandhi grew up worshiping the Hindu god Vishnu and following Jainism, a morally rigorous ancient Indian religion that espoused non-violence, fasting, meditation and vegetarianism.
During Gandhi’s first stay in London, from 1888 to 1891, he became more committed to a meatless diet, joining the executive committee of the London Vegetarian Society, and started to read a variety of sacred texts to learn more about world religions.
Living in South Africa, Gandhi continued to study world religions. “The religious spirit within me became a living force,” he wrote of his time there. He immersed himself in sacred Hindu spiritual texts and adopted a life of simplicity, austerity, fasting and celibacy that was free of material goods.</p>
</div>
</div>
Want spacing in-between here
<div class="card col-md-4">
<div class="card-body">
<h4 class="card-title">Gandhi’s Ashram & the Indian Caste System</h4>
<p class="card-text">
In 1915 Gandhi founded an ashram in Ahmedabad, India, that was open to all castes. Wearing a simple loincloth and shawl, Gandhi lived an austere life devoted to prayer, fasting and meditation. He became known as “Mahatma,” which means “great soul.”
In 1932, Gandhi, at the time imprisoned in India, embarked on a six-day fast to protest the British decision to segregate the “untouchables,” those on the lowest rung of India’s caste system, by allotting them separate electorates. The public outcry forced the British to amend the proposal.
</p>
</div>
</div>
</div>
</div>
</div>

Answer 1

Bootstrap 4 has spacing control classes as specified here
You can use such ml-2 to set margin left to be 0.5rem. The number can be:
0 : margin-left: 0;
1 : margin-left: 0.25rem;
2 : margin-left: 0.5rem;
3 : margin-left: 1rem;
4 : margin-left: 1.5rem;
5 : margin-left: 3rem;
There are other spacing controls as well, such as
mt for margin-top
pt for padding-top
.....

Answer 2

A fast solution that might need to play with it's margin and padding is to trying to add a border on the mid element. To do it you will have to:
create a CSS class like :
.sideborder{
border-left: 2px solid black;
border-right: 2px solid black;
}
Then you will have to add this class only into the mid div.
Although, i have to mention again that this might not be the best solution for you cause it demands a lot of css modification. Also condider for the space you want that you will either color the border sides as transparent or you will just add padding-left & padding-right to your mid div.