Довод "против" Cómo hacer que un menú ocupe todo el ancho de la página CSS

Hice меню ООН горизонтальный abajo de un div танго pero ООН ligero problema:

El menú никакой ocupa todo el ancho de la página, deja ООН espacio Лос lados.

#inicio
{
	background-color:#020213;
	color:white;
	min-width :100%;
	position:absolute;
	margin-left:auto;
	margin-right:auto;
	margin-top:auto;
	left:0; right:0; top:0;
}
#data
{
	background-color:black;
	color:white;
	height:100%;
	width:100%;
	margin-bottom:-1000px;
	padding-bottom:1000px;
}
#parteizquierda
{
	width:200px;
	height:100%;
	background-color:white;
	margin-bottom:-1000px;
	float:left;
	padding-bottom:1000px;
}
#derecha
{
	width:200px;
	height:100%;
	background-color:white;
	margin-bottom:-1000px;
	float:right;
	padding-bottom:1000px;
}
#menu{
	clear: both;
	float: left;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul li 
{
	float: left;
	list-style:none;
}
ul li a
{
	padding:.3em;
	float:left;
	padding-right:7em;
	display:block;
	border-right:2px solid;
	border-top: 1px solid #7C7C7C;
	border-bottom:1px solid #7C7C7C;
	border-left:1 px solid ;
	background-color:red;
	width:100%;
	text-align:center;
	padding-top:.1em;
	margin-left:0;
}
<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel="stylesheet" href="hola.css"/>
		<title> Cine </title>
	</head >
	<body>
		<div id="inicio">
			<h1/>
			<p>hola</p>
		</div>
		<br/>
		<br/>	
		<br/>
		<br/>
		<ul id="menu">
			<h2/>
			<li><a href="#">inicio</a></li>
			<li><a href="#">inicio</a></li>
			<li><a href="#">inicio</a></li>
			<li><a href="#">inicio</a></li>
			<li><a href="#">inicio</a></li>
		</ul>
		<div  id="data"></div>
		<div id="parteizquierda"></div>
		<div id="derecha"></div>
	</body>
</html>
1
задан 21.01.2017, 08:52
0 ответов