Hola quisiera saber si mepueden ayudar con este problema que tengo:
estoy haciendo un template, y es la primera vez que me pasa, no puedo centrarlo, tambien es la primera vez que me meto un poco con el CSS, y creo que ahi debe estar el problema.
les dejo el codigo, para ver si pueden detectar el problema:
Código HTML:
<html>
<head>
<title>OS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- Save for Web Styles (Sin título-1) -->
<style type="text/css">
<!--
/*Menu*/
#style1 h1 {
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
background-color: #FFF;
width: 120px;
text-align: right;
padding: 5px;
margin: 0px;
float: left;
border-top: 1px solid #FF6600;
border-right: 1px solid #FF6600;
border-left: 1px solid #FF6600;
}
#style1 ul {
font-size: 14px;
font-weight: bold;
margin: 7px;
padding: 0px;
list-style: none;
}
#style1 li {
float: left;
}
#style1 li a {
width: 100px;
color: #FFFFFF;
text-decoration: none;
display: block;
padding: 5px 0px 5px 5px;
text-transform: uppercase;
}
#style1 li a:visited {
color: #999;
text-decoration: none;
}
#style1 li a:hover {
color: #000000;
text-decoration: none;
font-size: 14px;
text-align: center;
font-family: Calibri;
}
.content_box1 {
font-family: Arial;
font-size: 11px;
clear: left;
background-color: #FFF;
border: 1px solid #FF6600;
width: 720px;
padding: 15px;
}
/*Fin Menu*/
#Tabla_01 {
position:absolute;
left:0px;
top:0px;
width:1px;
height:800px;
float: right;
font-family: Calibri;
overflow: visible;
}
#OS-01 {
position:absolute;
left:0px;
top:0px;
width:3px;
height:800px;
}
#header {
position:absolute;
left:3px;
top:0px;
width:634px;
height:139px;
background-image: url(imágenes/header.png);
}
#OS-03 {
position:absolute;
left:637px;
top:0px;
width:3px;
height:800px;
}
#menu {
position:absolute;
left:3px;
top:139px;
width:634px;
height:39px;
background-image: url(imágenes/menu.png);
text-align: left;
}
#cuerpo {
position:absolute;
left:3px;
top:178px;
width:634px;
height:588px;
background-color: #FFF;
font-weight: bold;
font-variant: small-caps;
float: right;
}
#footer {
position:absolute;
left:3px;
top:766px;
width:634px;
height:24px;
background-image: url(imágenes/footer.png);
}
#OS-07 {
position:absolute;
left:3px;
top:790px;
width:634px;
height:10px;
}
#cuerpo {
text-align: left;
}
#style1 ul li {
text-align: center;
}
#header {
text-align: left;
}
#header {
color: #FFF;
}
#logo {
font-size: 80px;
margin: 20px;
padding: 20px;
font-weight: 800;
}
#Tabla_01 #cuerpo blockquote p {
font-size: 20px;
}
-->
</style>
<!-- End Save for Web Styles -->
</head>
<body style="background:url('imágenes/fondo.png'); text-align: center; font-size: 18px;">
<!-- Save for Web Slices (Sin título-1) -->
<div id="Tabla_01">
<div id="OS-01">
<img src="imágenes/OS_01.png" width="3" height="800" alt="">
</div>
<div id="header">
<span id="logo">Logo</span></div>
<div id="OS-03">
<img src="imágenes/OS_03.png" width="3" height="800" alt="">
</div>
<div id="menu"><center>
<div alig="ceneter" id = "style1">
<ul>
<li><a href ="#">Incio</a></li>
<li><a href ="#">InformaciÓN</a></li>
<li><a href ="#">Contacto</a></li>
</ul>
</div></center>
</div>
<div id="cuerpo">
<blockquote>
<p>
Diseño credo por Tony_GT</p></blockquote>
</div>
<div id="footer">Creado por tony_gt</div>
<div id="OS-07">
<img src="imágenes/OS_07.png" width="634" height="10" alt="">
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>
espero que puedan ayudarme.
saludos