Hola estoy aprendiendo a hacer mi primera pagina y mi codigo de CSS es este:
html{font-size:10px;font-family:'Open Sans',sans-serif;}
page-container{
position: relative;
min-height: 100vh;
h1{font-size:40px;text-align:center;
p{font-size:20px;text-align:center;}
li{display: inline; text-align: center;font-size: 20px}
nav,header{text-align: center}
}
content-wrap{
padding-bottom: 2.5rem;
}
footer{
position: absolute;
text-align: center;
bottom: 0;
width: 100%;
height: 3.5rem;
right: 8px;
}
Segun yo lo escribi como salia en el tutorial de mozilla, pero a la hora de ver la pagina las lista de nav no queda en formato horizontal queda como lista normal, otra cosa que tiene es que el footer no está siendo alineado al medio. Lo que si, cuando lo abro en local me sale el formato bien pero el index corrido, como con margenes no puesto y básicamente todos los html que tengo en el servidor parten de la misma base asi que no deberia pasar eso, incluso todos usan el mismo style lo cual no sé si es correcto. Este es el codigo de la pagina como tal y en todos es practicamente el mismo cambiando los href de acuerdo a la pagina en la que estoy.
<!DOCTYPE html>
<html lang="es">
<head>
<meta http-equiv="cache-control" content="no-cache">
<meta name="author" content="Author">
<meta name="description" content="Aqui encontrarás la información de contacto.">
<meta charset="utf-8">
<link href="styles/style.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">
<title>Inicio</title>
<link rel="shortcut icon" href="favicon.ico?v=2" type="image/x-icon"/>
<link rel="icon" href="favicon.ico?v=2" type="image/x-icon"/>
</head>
<body>
<div id="page-container">
<div id="content-wrap">
<header id="header"><h1>Contacto</h1>
</header>
<nav id="nav">
<ul>
<li><a href="index.html">Incio</a></li>
<li>Contacto</li>
<li><a href="proyectos.html">Proyectos</a></li>
<li><a href="descargas.html">Descargas</a></li>
</ul>
<hr>
</nav>
<p><a href="mailto:[email protected]">Enviame un correo</a></p>
</div>
<footer id="footer">©Copyright 2020.</footer>
</div>
</body>
</html>