Que tal tengo un problema con el menú, izquierdo, lo que pasa que cuando lo intento borrar de index.html, se borra también la tabla donde va la parte central de la pagina, me podrían ayudar
este es el código HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>TEATRO DE VIDA</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera"><div id="logotipo">[contenido no disponible]</div><div id="publicidad">Bienvenidos a mi Web</div></div>
<div id="navegacion">
<ul>
portada Historia del grupo Discografia Conciertos Descargas Foro Souvenir
</div>
<div id="contenido"><div id="menu">
<ul>
<h1>titulo de seccion 1</h1>
enlace 1 enlace 2 enlace 3 enlace 4
</div><h1>Esta será la zona principal de la web</h1>
<h2>este es el segundo parrafo</h2>
Ya sabemos que gracias a la Hoja de Estilos, podemos cambiar el tamaño de la letra de toda la web, podemos varias los aspectos de los enlaces, los fondos de ciertos elementos, etc, etc sin más que poner la propiedad correspondiente. Pero para eso, todas las partes del contenido de la página web deben "ser algo". Si son enlaces modificaremos la etiqueta "a", si son párrafos la etiqueta "p", pero, qué etiqueta hemos de modificar para cambiar las propiedades del texto de la parte principal de nuestra plantilla? Aquella en la que pone "Esta será la zona principal de la web"?</p></div>
<div id="pie">
<div id="pieuno">
<ul>
Foro ejemplo Contactos Nos Enlaza
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
Directorio TopSite Mapa De La Web
</div>
</div>
<div id="curva-inferior"></div>
</body>
</html>
si borro el menu lateral queda asi:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>TEATRO DE VIDA</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera"><div id="logotipo">[contenido no disponible]</div><div id="publicidad">Bienvenidos a mi Web</div></div>
<div id="navegacion">
<ul>
portada Historia del grupo Discografia Conciertos Descargas Foro Souvenir
</div>
</div><h1>Esta será la zona principal de la web</h1>
<h2>este es el segundo parrafo</h2>
Ya sabemos que gracias a la Hoja de Estilos, podemos cambiar el tamaño de la letra de toda la web, podemos varias los aspectos de los enlaces, los fondos de ciertos elementos, etc, etc sin más que poner la propiedad correspondiente. Pero para eso, todas las partes del contenido de la página web deben "ser algo". Si son enlaces modificaremos la etiqueta "a", si son párrafos la etiqueta "p", pero, qué etiqueta hemos de modificar para cambiar las propiedades del texto de la parte principal de nuestra plantilla? Aquella en la que pone "Esta será la zona principal de la web"?</p></div>
<div id="pie">
<div id="pieuno">
<ul>
Foro ejemplo Contactos Nos Enlaza
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
Directorio TopSite Mapa De La Web
</div>
</div>
<div id="curva-inferior"></div>
</body>
</html>
y lo que es la hoja de estilo es asi:
* {margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color: blue; font-weighe: bold; text-decoration: underline; text-align: center}
h2 {font-size: 1.1em; color: blue; font-weighe: bold; text-decoration: none; text-align: center}
body {text-align: center; background-color: #BEBEBE}
#global {width:800px ; margin: 4px auto }
#curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat; width: 800px; height: 12px; overflow : hidden }
#cabecera {background-color: white; border-left: black 1px solid ; border-right: black 1px solid; height:85px}
#logotipo {width:280px; float:left }
#publicidad {width:518px ; float:right ; margin-top:25px }
#navegacion {background-color: gray; border: black 1px solid; height: 20px }
#navegacion li {float:left; list-style: none; margin: 0px 10px 0px 10px; font-size: 10px}
#navegacion ul { margin-left: 180px }
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {width: 150px ; float:left; text-align:left; margin-right: 10px; background-image: url(objetos/menu-parte-inferior.gif); background-position: bottom; padding-bottom:5px }
#menu li { list-style:none; margin: 4xp 0xp 4xp 6xp}
#menu h1 { text-decoration:none; font-size:10px; background-image: url(objetos/menu-parte-superior.gif); padding-top:12px }
#pie { background-color: white; border-left: black 1px solid; border-right: black 1px solid; border-top: black 1px solid; height: 65px }
#pie li {list-style: none; font-size: 10px }
#pieuno { float:left; width: 150px }
#piedos { float:left;width: 498px }
#pietres { float:left; width: 150px }
#curva-inferior { background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat; width:800px; height: 12px; overflow: hidden }
a {color: black; font-size:1.3em ; text-decoration: none}
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline; background-color: silver}
a:active {}
#pie a { color: blue; text-decoration:none; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover { color:black; text-decoration:underline; background-color: white }
#pie a:active { color:black }
y queda reflejado en la pagina de esta forma:
http://teatro.onlinewebshop.net/plantilla.html (esa es la pagina que subi en el servidor)
gracias por su atencion
este es el código HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>TEATRO DE VIDA</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera"><div id="logotipo">[contenido no disponible]</div><div id="publicidad">Bienvenidos a mi Web</div></div>
<div id="navegacion">
<ul>
</div>
<div id="contenido"><div id="menu">
<ul>
<h1>titulo de seccion 1</h1>
</div><h1>Esta será la zona principal de la web</h1>
<h2>este es el segundo parrafo</h2>
Ya sabemos que gracias a la Hoja de Estilos, podemos cambiar el tamaño de la letra de toda la web, podemos varias los aspectos de los enlaces, los fondos de ciertos elementos, etc, etc sin más que poner la propiedad correspondiente. Pero para eso, todas las partes del contenido de la página web deben "ser algo". Si son enlaces modificaremos la etiqueta "a", si son párrafos la etiqueta "p", pero, qué etiqueta hemos de modificar para cambiar las propiedades del texto de la parte principal de nuestra plantilla? Aquella en la que pone "Esta será la zona principal de la web"?</p></div>
<div id="pie">
<div id="pieuno">
<ul>
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
</div>
</div>
<div id="curva-inferior"></div>
</body>
</html>
si borro el menu lateral queda asi:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>TEATRO DE VIDA</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera"><div id="logotipo">[contenido no disponible]</div><div id="publicidad">Bienvenidos a mi Web</div></div>
<div id="navegacion">
<ul>
</div>
</div><h1>Esta será la zona principal de la web</h1>
<h2>este es el segundo parrafo</h2>
Ya sabemos que gracias a la Hoja de Estilos, podemos cambiar el tamaño de la letra de toda la web, podemos varias los aspectos de los enlaces, los fondos de ciertos elementos, etc, etc sin más que poner la propiedad correspondiente. Pero para eso, todas las partes del contenido de la página web deben "ser algo". Si son enlaces modificaremos la etiqueta "a", si son párrafos la etiqueta "p", pero, qué etiqueta hemos de modificar para cambiar las propiedades del texto de la parte principal de nuestra plantilla? Aquella en la que pone "Esta será la zona principal de la web"?</p></div>
<div id="pie">
<div id="pieuno">
<ul>
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
</div>
</div>
<div id="curva-inferior"></div>
</body>
</html>
y lo que es la hoja de estilo es asi:
* {margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color: blue; font-weighe: bold; text-decoration: underline; text-align: center}
h2 {font-size: 1.1em; color: blue; font-weighe: bold; text-decoration: none; text-align: center}
body {text-align: center; background-color: #BEBEBE}
#global {width:800px ; margin: 4px auto }
#curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat; width: 800px; height: 12px; overflow : hidden }
#cabecera {background-color: white; border-left: black 1px solid ; border-right: black 1px solid; height:85px}
#logotipo {width:280px; float:left }
#publicidad {width:518px ; float:right ; margin-top:25px }
#navegacion {background-color: gray; border: black 1px solid; height: 20px }
#navegacion li {float:left; list-style: none; margin: 0px 10px 0px 10px; font-size: 10px}
#navegacion ul { margin-left: 180px }
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {width: 150px ; float:left; text-align:left; margin-right: 10px; background-image: url(objetos/menu-parte-inferior.gif); background-position: bottom; padding-bottom:5px }
#menu li { list-style:none; margin: 4xp 0xp 4xp 6xp}
#menu h1 { text-decoration:none; font-size:10px; background-image: url(objetos/menu-parte-superior.gif); padding-top:12px }
#pie { background-color: white; border-left: black 1px solid; border-right: black 1px solid; border-top: black 1px solid; height: 65px }
#pie li {list-style: none; font-size: 10px }
#pieuno { float:left; width: 150px }
#piedos { float:left;width: 498px }
#pietres { float:left; width: 150px }
#curva-inferior { background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat; width:800px; height: 12px; overflow: hidden }
a {color: black; font-size:1.3em ; text-decoration: none}
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline; background-color: silver}
a:active {}
#pie a { color: blue; text-decoration:none; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover { color:black; text-decoration:underline; background-color: white }
#pie a:active { color:black }
y queda reflejado en la pagina de esta forma:
http://teatro.onlinewebshop.net/plantilla.html (esa es la pagina que subi en el servidor)
gracias por su atencion