CSS - Desplazamiento de bloque

 
Vista:
sin imagen de perfil

Desplazamiento de bloque

Publicado por Mario (3 intervenciones) el 28/01/2018 19:08:46
Alguien sabría decirme por qué el bloque donde tengo las direcciones en esta página:

http://mariofranciaroman.mipropia.com/

está desplazado hacia la derecha?

Os adjunto el código de la página:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
<head><meta charset="utf-8" />
<title>Mario Francia Román</title>
<link href="indexCSS.css" rel="stylesheet" />
<link href="general.css" rel="stylesheet" />
</head>
 
<body>
 
<header>
<h1>Mario Francia Román</h1>
<h1>Curriculum</h1>
</header>
 
<nav>
<ul class="vertical">
<li><div id="dp"><a href="http://mariofranciaroman.mipropia.com/datosPersonales.html">Datos personales</a></div></li>
<li><a href="http://mariofranciaroman.mipropia.com/formacionAcademica.html">Formación académica</a></li>
<li><a href="http://mariofranciaroman.mipropia.com/idiomas.html">Idiomas</a></li>
<li><a href="http://mariofranciaroman.mipropia.com/experienciaLaboral.html">Experiencia profesional</a></li>
</ul>
</nav>
 
<footer id="foot"><p>Página en actual desarrollo 01/01/2018</p></footer>
 
</body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
body{
	font-family: Liberation Serif;
	background-color: #FFFACD;
}
footer{
	font-size: small;
}
 
#centrar{
	text-align:center;
}
 
#justificar{
	text-align:justify;
}
 
#imagenCentro{
	text-align: center;
}
 
article{
	text-align:justify;
}
 
.navegador ul{
	display: inline-block;
	margin: 0;
	padding: 0;
	position: center;
	width: 100%;
}
 
.horizontal li{
	float:left;
	list-style-type: none;
	width: calc(100% / 4);
}
.horizontal a {
	display:block;
	border-top : 1px solid #696969; 
	border-bottom : 1px solid #696969; 
	border-right: 0.5px solid #696969;
	border-left: 0.5px solid #696969;
	text-decoration: none;
	margin: 0;
	color: #000000;
	background-color: #FFDEAD;
	text-align: center;
	padding: 7px;
}
.horizontal a:hover, .horizontal a:active{
	color: #2F4F4F;
	background-color: #FFA07A;
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
/* ESTILO */
 
li {
	list-style-type:none;
	background-color: #FFDEAD
}
a:hover, a:active{
	color: #2F4F4F;
	background-color: #FFA07A;
}
nav a{
	display: block;
	background-color: #FFDEAD;
	text-decoration: none;
	color: #000000;
}
 
/* MAQUETACIÓN */
 
header{
	text-align: center;
	margin: auto;
}
 
nav{
	padding-top: 70px;
	padding-bottom: 200px;
	text-align:center;
	margin: auto;
	max-width: 300px;
}
a{
	padding:13px;
	border-bottom : 0.5px solid #696969;
	border-left:0.5px solid #696969;
	border-right:0.5px solid #696969;
}
#dp{
	border-top: 0.5px solid #696969;
}
footer{
	position: relative;
	margin-top: -50px;
	margin: auto;
	text-align: right;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 624
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Desplazamiento de bloque

Publicado por xve (490 intervenciones) el 28/01/2018 20:08:03
Hola Mario, al <ul> del menú, ponle padding: 0;

Esto lo ves muy claro con el inspector de elementos del navegador
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil

Desplazamiento de bloque

Publicado por Mario (3 intervenciones) el 28/01/2018 20:22:06
muchas gracias, funcionó!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Desplazamiento de bloque

Publicado por Mario (3 intervenciones) el 30/01/2018 15:09:36
una pregunta, sabrías decirme por qué en mozilla firefox, tras corregir el archivo se refleja el cambio y en google chrome no? (he recargado la página no es problema de caché)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar