When a DIV is set to have 100% width,  you may see horizontal scroll bar appearing. This is due padding, margin and type of position.

To make a DIV with 100% width without horizontal scroll bar appearing, try the following:

1) Set the DIV position type to fixed. Suitable for DIV to be used as a fixed position header.

.div_header{
	height: 30px;
	border-color: black;
	top: 0px;
	width: 100%;
	position: fixed;
}

2) Let the DIV position type to be default. Width = auto. This is the simplest method. Remove left and right margins.

.div{
 	height: 30px;
	border-color: black;
 	width: auto;
 	margin-left: 0px;
	margin-right: 0px;
}

3)  Set the DIV position type to relative. Width = 100%. Remove border, margin and padding for both left and right of the DIV. Any padding or margin will cause horizontal bar to appear.

.div{
	height: 30px;
	border-color: black;
	position: relative;
 	margin-left: 0px;
 	margin-right: 0px;
 	padding-left: 0px;
 	padding-right: 0px;
 	width: 100%;
	border: none;
}