Hola, quiero saber qué estoy haciendo mal. He intentado avanzar por mi parte sobre el curso y quise agregar dos imagenes como borde. Lo hice desde la hoja de estilo-general.css y cuando hago vista previa en la plantilla se ve perfecto, como yo quiero que quede. Pero cuando la subo al servidor y la visualizo desde google chrome se ve todo desencajado. Los bordes se alinean a la derecha y tiran el contenido hacia abajo.
Los bordes estan dentro de "contenido" uno a la izquierda y otro a la derecha, como guardas sobre los costados.
Dejo mi archivo de Estilos:
*{margin:0px; padding:0px; border:0px;}
body {text-align:center;}
a {color:blue; font-size:1.2em; text-decoration:none; display:block;}
a:link {}
a:visited {color: brown}
a:hover {color: red; text-decoration: underline; background:silver;}
a:active {}
p {text-align:justify;}
#curva-superior {background-image:url(objetos/curva-superior.gif); background-repeat:no-repeat; width:800px; height:12px; overflow:hidden;}
#cabecera {background-color:black; border-left: black 1px solid; border-right: black 1px solid; border-bottom: black 1px solid;}
#navegacion {height:20px; background-color:grey; border-left:black 1px solid; border-right:black 1px solid;}
#navegacion li {float:left; list-style:none; margin:0px 30px 0px 30px;}
#navegacion ul {margin-left:100px;}
#menu {background-color:yellow; float:left; text-align:left; margin:3px 10px 3px 3px; border:black 1px solid; width:auto;}
#menu li {list-style:none; margin:10px 10px 10px 10px; width:auto;}
#menu a{text-align: left;}
#contenido {background-color:orange; width:800px; border:black 1px solid;}
#contenido p{padding:5px 50px 5px 50px; text-indent:10px;}
#contenido a{text-align: center; color: blue; text-decoration: underline;}
#borde1 {background-image:url(objetos/borde-izq.gif); background-repeat:no-repeat; width:50px; height:472px;float:left;}
#borde2 {background-image:url(objetos/borde-izq.gif); background-repeat:no-repeat; width:50px; height:472px;float:right;}
#pie {background-color:white; border-left:black 1px solid; border-right:black 1px solid; border-top:black 1px solid;}
#global {width:800px; margin:4px auto;}
h1 {font-size:1.3em; color:black; font-weight:bold; text-decoration:underline; text-align:center;}
h2 {font-size:1.2em; color:black; font-weight:bold; text-decoration:none; text-align:center;}
#curva-inferior {background-image:url(objetos/curva-inferior.gif); background-repeat:no-repeat; width:800px; height:12px; overflow:hidden;}
#banner2 {background-color:black;}
#publicidad {width=798px; height=100px; background-color: black; color:white;}
y mi plantilla:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="banner2"><img src="objetos/banner2.jpg" width="600" height="200" alt="Haz click aquí para volver a la página de inicio"></div>
<div id="publicidad">(espacio para publicidad)</div>
</div>
<div id="navegacion">
<ul><li><a href="#">Canciones</a></li><li><a href="#">Fotos</a></li><li><a href="#">Home-Studio</a></li><li><a href="#">Letras y acordes</a></li></ul>
</div>
<div id="contenido">
<div id="borde1"></div>
<div id="borde2"></div>
<div id="menu">
<ul>
<li><a href="#">Enlace 1</a></li>
<li><a href="#">Enlace 2</a></li>
<li><a href="#">Enlace 3</a></li>
<li><a href="#">Enlace 4</a></li>
</ul>
</div>
<h2>Bio</h2>
<p>Comencé a tocar la guitarra y cantar a los 17 años. Nunca estudié música pero pude aprender gracias a mis amigos que me enseñaron canciones y me contagiaron de la música. Escribí varias canciones a las que luego les agregué la música.
Con dos amigos, Federico Castellano y Martín Geneizir (Domo) comenzamos a ensayar en el sótano y armamos una banda que luego se disolvió. Sin embargo el provecho que saqué fue la experiencia en el tema de la grabación. Tras mucho estudio y
esfuerzo económico, comencé a grabar mis canciones con lo que aprendí básicamente a tocar diferentes instrumentos y junto con la música, otro proyecto fue creciendo paralelamente.</p>
<p>Actualmente me estoy dedicando a la grabación y el armado de un estudio de grabación como proyecto principal. Sin perjuicio de ello, sigo grabando
temas para completar un CD solista, del cual dispongo ya de temas grabados, mezclados y masterizados en mi home-studio, que voy a ir poniendo en la
página. Por supuesto, a medida que voy ampliando el estudio y haciéndome con nuevos equipos de grabación, voy intentando aplicar los nuevos conocimientos
y equipos a las grabaciones, con lo cual el proceso va mejorando, a la vez que se extiende. De todos modos la música es una forma de expresarme, relajarme
y, si el destino lo permite, intentaré hacer de ella una forma de vida. Lamentablemente el rock de Córdoba cuenta con poca participación de prensa,
difusión e inversión (producción) a nivel provincial y nacional, por lo que las bandas y artistas prácticamente costean sus propios proyectos de
manera independiente.</p>
<p>Hoy en día uno de mis proyectos es llevar la música de Córdoba a un nivel profesional de grabación al menor costo posible, para favorecer la
difusión de las bandas locales.
Los temas que pueden escuchar fueron integramente grabados en casa, compuestos e interpretados por mi.
Creo en la música como arte y en el arte para todos, por eso comparto gratuitamente mis temas para descarga y reproducción online. Se puede acceder a ellos en:<a href="http://www.reverbnation.com/pablobritos">www.reverbnation.com/pablobritos</a></p>
</div>
<div id="pie">Este es el pie de la página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
Y para ver como se visualiza vayan a http://www.pabloabritos.com.ar/plantilla.html
cualquier ayuda sera agradecida!
saludos
lurhandur
Los bordes estan dentro de "contenido" uno a la izquierda y otro a la derecha, como guardas sobre los costados.
Dejo mi archivo de Estilos:
*{margin:0px; padding:0px; border:0px;}
body {text-align:center;}
a {color:blue; font-size:1.2em; text-decoration:none; display:block;}
a:link {}
a:visited {color: brown}
a:hover {color: red; text-decoration: underline; background:silver;}
a:active {}
p {text-align:justify;}
#curva-superior {background-image:url(objetos/curva-superior.gif); background-repeat:no-repeat; width:800px; height:12px; overflow:hidden;}
#cabecera {background-color:black; border-left: black 1px solid; border-right: black 1px solid; border-bottom: black 1px solid;}
#navegacion {height:20px; background-color:grey; border-left:black 1px solid; border-right:black 1px solid;}
#navegacion li {float:left; list-style:none; margin:0px 30px 0px 30px;}
#navegacion ul {margin-left:100px;}
#menu {background-color:yellow; float:left; text-align:left; margin:3px 10px 3px 3px; border:black 1px solid; width:auto;}
#menu li {list-style:none; margin:10px 10px 10px 10px; width:auto;}
#menu a{text-align: left;}
#contenido {background-color:orange; width:800px; border:black 1px solid;}
#contenido p{padding:5px 50px 5px 50px; text-indent:10px;}
#contenido a{text-align: center; color: blue; text-decoration: underline;}
#borde1 {background-image:url(objetos/borde-izq.gif); background-repeat:no-repeat; width:50px; height:472px;float:left;}
#borde2 {background-image:url(objetos/borde-izq.gif); background-repeat:no-repeat; width:50px; height:472px;float:right;}
#pie {background-color:white; border-left:black 1px solid; border-right:black 1px solid; border-top:black 1px solid;}
#global {width:800px; margin:4px auto;}
h1 {font-size:1.3em; color:black; font-weight:bold; text-decoration:underline; text-align:center;}
h2 {font-size:1.2em; color:black; font-weight:bold; text-decoration:none; text-align:center;}
#curva-inferior {background-image:url(objetos/curva-inferior.gif); background-repeat:no-repeat; width:800px; height:12px; overflow:hidden;}
#banner2 {background-color:black;}
#publicidad {width=798px; height=100px; background-color: black; color:white;}
y mi plantilla:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="banner2"><img src="objetos/banner2.jpg" width="600" height="200" alt="Haz click aquí para volver a la página de inicio"></div>
<div id="publicidad">(espacio para publicidad)</div>
</div>
<div id="navegacion">
<ul><li><a href="#">Canciones</a></li><li><a href="#">Fotos</a></li><li><a href="#">Home-Studio</a></li><li><a href="#">Letras y acordes</a></li></ul>
</div>
<div id="contenido">
<div id="borde1"></div>
<div id="borde2"></div>
<div id="menu">
<ul>
<li><a href="#">Enlace 1</a></li>
<li><a href="#">Enlace 2</a></li>
<li><a href="#">Enlace 3</a></li>
<li><a href="#">Enlace 4</a></li>
</ul>
</div>
<h2>Bio</h2>
<p>Comencé a tocar la guitarra y cantar a los 17 años. Nunca estudié música pero pude aprender gracias a mis amigos que me enseñaron canciones y me contagiaron de la música. Escribí varias canciones a las que luego les agregué la música.
Con dos amigos, Federico Castellano y Martín Geneizir (Domo) comenzamos a ensayar en el sótano y armamos una banda que luego se disolvió. Sin embargo el provecho que saqué fue la experiencia en el tema de la grabación. Tras mucho estudio y
esfuerzo económico, comencé a grabar mis canciones con lo que aprendí básicamente a tocar diferentes instrumentos y junto con la música, otro proyecto fue creciendo paralelamente.</p>
<p>Actualmente me estoy dedicando a la grabación y el armado de un estudio de grabación como proyecto principal. Sin perjuicio de ello, sigo grabando
temas para completar un CD solista, del cual dispongo ya de temas grabados, mezclados y masterizados en mi home-studio, que voy a ir poniendo en la
página. Por supuesto, a medida que voy ampliando el estudio y haciéndome con nuevos equipos de grabación, voy intentando aplicar los nuevos conocimientos
y equipos a las grabaciones, con lo cual el proceso va mejorando, a la vez que se extiende. De todos modos la música es una forma de expresarme, relajarme
y, si el destino lo permite, intentaré hacer de ella una forma de vida. Lamentablemente el rock de Córdoba cuenta con poca participación de prensa,
difusión e inversión (producción) a nivel provincial y nacional, por lo que las bandas y artistas prácticamente costean sus propios proyectos de
manera independiente.</p>
<p>Hoy en día uno de mis proyectos es llevar la música de Córdoba a un nivel profesional de grabación al menor costo posible, para favorecer la
difusión de las bandas locales.
Los temas que pueden escuchar fueron integramente grabados en casa, compuestos e interpretados por mi.
Creo en la música como arte y en el arte para todos, por eso comparto gratuitamente mis temas para descarga y reproducción online. Se puede acceder a ellos en:<a href="http://www.reverbnation.com/pablobritos">www.reverbnation.com/pablobritos</a></p>
</div>
<div id="pie">Este es el pie de la página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
Y para ver como se visualiza vayan a http://www.pabloabritos.com.ar/plantilla.html
cualquier ayuda sera agradecida!
saludos
lurhandur