CSS width设置为100%

在子元素中设置width:100%容易溢出，因为子元素内容已经和父元素的大小一致，如果子元素还有内边距（padding）、边框（border）、外边距（margin）,这样会使子元素溢出父元素。

父元素没有内边距,溢出明细

<div class="parent">

	<div class="child">
		<p>123456789ffffffffddddddddddddddddddddff</p>
	</div>
</div>


.child{
	height:50px;
	width:100%;
	background-color:red;
	padding:10px;
	margin:10px;
	border:5px dashed yellow;
}

.parent{
	background-color:black;
	height:200px;
	width:400px;
}

父元素有内边距，可能仍会溢出，有内边距部分弥补

.child{
	height:50px;
	width:100%;
	background-color:red;
	padding:10px;
	margin:10px;
	border:5px dashed yellow;
}

.parent{
	background-color:black;
	height:200px;
	width:400px;
	padding:30px;
	border:5px solid grey;
}