CSS - AutoWidth

Auto width;

HTML

<div class="content">
    <div class="node"></div>
    <div class="father">
        <span class="child">1-22222-33333</span>
      <span class="child">1-22222-33333</span>
    </div>
</div>
<ul class="accumulatelist">
							<li>
								<h4>本年用电量累计</h4>
								<img src="img/electricity-select.png" />
								<div>
									<span>3310644.28</span>
								    <b>KWH</b>
								</div>
								
							</li>
							<li>
								<h4>本年用水量累计</h4>
								<img src="img/water.png" />
								<span>36067.20</span>
								<b>T</b>
							</li>
</ul>

CSS

.content {
    width: 100%;
    height: 100%;
    background-color: grey;
}
.node {
    width: 100%;
    height: 40px;
}
.father {
    width: auto;
    display: inline-block;
    background-color: cyan;
}
.child {
    background-color: green;
    color: #fff;
    padding: 10px;
    border: 2px solid #000;
    margin: 15px;
    dispaly:block;
}

.accumulatelist{
	color: #FFFFFF;
	list-style: none;
	padding: 0;
	margin-top: 28px;
	margin-left: 73px;
	margin-bottom: 0px;
}
.accumulatelist li{
	display: inline-block;
	vertical-align: top;
}
.accumulatelist li h4{
	padding-left: 3px;
	letter-spacing: 1px;
	text-align: center;
	font-size: 14px;
}
.accumulatelist li img{
	width: 116px;
	height: 119px;
	margin: 15px 18px 15px 17px;
	cursor: pointer;
}
.accumulatelist li div{
}
.accumulatelist li span{
	display: block;
	font-size: 24px;
	text-align: center;
	max-width: 150px;
	word-break:break-all;
}
.accumulatelist li b{
	display: block;
	font-size: 23px;
	max-width: 150px;
	text-align: center;
}