3行div或表格，每行有不同的样式（文字和图片）

Question

我被困在这一天大约一天，似乎无法找到解决这个问题的最佳方法。

我试图将多个行中的3个元素内联到潜水中。

一个粗体标题，一个常规文本元素和一个小图标，需要在每个标题之间留出5倍的间距。

这是我的代码，它在jfiddle中的缩放比在我的html文档上有所不同。但我相信一般的想法很清楚。 在我看来，我想为每个元素添加填充，但我不知道如何解决这个问题。

我在css中为每个班级添加了注释

/* Typography */

h5 {
	font-family: 'proxima_nova_rgbold', sans-serif;
	font-size: 16px;
	line-height: 20px;
	font-weight: bold;
	padding: 40px 0 20px 40px;
}

h3 {
	font-family: 'proxima_nova_rgbold', sans-serif;
	font-size: 16px;
	line-height: 20px;
	font-weight: bold;
	padding: 40px 0 0 40px;
}
p {
	font-size: 16px;
	line-height: 20px;
	text-align: left;
	font-family: 'proxima_nova_rgregular', sans-serif;
}

/* Main Wrapper For Everything*/

.weatherwrapper {
	height: 1000px;
}

/* Container Housing Both Main Weather Divs*/

.weathercontainer {
	margin: 0 auto;
	height: 888px;
	width: 1046px;
}

/*Left Yellow Div */

.currentweather {
	height: 444px;
	width: 621px;
	float: left;
	border-radius: 10px;
	background: linear-gradient(134.68deg, #FDDA14 0%, #FDC814 100%);
	box-shadow: 0 2px 6px 0 rgba(0,0,0,0.2);
}

/* Current Weather Details */

.currentdetails {
	width: 415px;
	height: 115px;
	align: center;
}

/* Hourly box */

.weathercontent {
	height: 142px;	
	width: 541px;
	margin-left: 40px;
	border: 1px solid #ECECEC;	
	border-radius: 10px;	
	background-color: #FFFFFF;
}
	

/* Right Grey Div */

.forecast {
	height: 444px;
	width: 407px;
	float: left;
	margin-left: 10px;
	padding-top: 15px;
	border-radius: 10px;
	background-color: #686868;
	box-shadow: 0 2px 6px 0 rgba(0,0,0,0.2);
}

/* Dividing Line Forcast Div */

.weatherdivider {
	height: 1.02px;
	width: 100%;
	background-color: black;
}


/* Forcast Div For Each Row */
.forecastcontent {
	display: inline-block;
	width: 407px;
}



.jumbo-padding {
	padding: 60px 0;
}

.background-blue {
	background-color: #F0F5FB;
}

<div class="weatherwrapper jumbo-padding background-blue">
    <div class="weathercontainer">
        <h1 align="left">Weather</h1>
        <div class="currentweather">
            <h3 align="left">Current Weather</h3>
            <div class="currentdetails"> 24 degrees address etc </div>
            <div class="weathercontent"> </div>
        </div>
        <div class="forecast">
            <div class="forecastcontent">
                <h5 style="color: white;"> 5 Day Weather Forecast</h5>
            </div>
            <div class="weatherdivider"></div>
            <div class="forecastcontent">
                <h5 style="color: white;">Wednesday</h5>
                <p> 19° | 11° </p>
                <img src="http://i.imgur.com/Czilat3.png"/>
            </div>
            <div class="weatherdivider"></div>
            <div class="forecastcontent">
                <h5 style="color: white;">Thursday</h5>
            </div>
            <div class="weatherdivider"></div>
            <div class="forecastcontent">
                <h5 style="color: white;">Friday</h5>
            </div>
            <div class="weatherdivider"></div>
            <div class="forecastcontent">
                <h5 style="color: white;">Saturday</h5>
            </div>
            <div class="weatherdivider"></div>
            <div class="forecastcontent">
                <h5 style="color: white;">Sunday</h5>
            </div>
        </div>
    </div>
</div>