Hola!! Voy por la lección tres y pensaba que ya iría solucionando mi duda conforme fuera moviendo y arreglando cosas, pero no xD
He puesto, tal y como se indica en el curso, la propiedad de display block en el menú lateral (para que los enlaces salgan en hover sin necesidad de que el cursor esté encima de la palabra, sino sólo estando encima de la línea), pero no sé por qué no hay ninguna reacción xDD es como si no hubiera puesto nada...
Seguro que al final la solución es una tontería pero os agradecería mucho que me ayudárais porque la duda esta me está matando!! jajajaja
os pongo el codigo de la plantilla:
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">
<a href="index.html">
[contenido no disponible]
</a>
</div>
<div id="publicidad">Bienvenidos a mi web</div>
</div>
<div id="navegacion">
<ul>
<h1>Título sección 1</h1>
Sección 1 Sección 2 Sección 3 Sección 4
</div>
<div id="contenido">
<div id="menu">
<ul>
Enlace 1 Enlace 2 Enlace 3
</div>
<h1>Este es un título de importancia Uno</h1>
Este es el contenido de mi página</p>
Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
<h2>Y este es el tercer párrafo.</h2>
En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.
Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p></div>
<div id="pie">Este es mi pie de página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
y el de mi hoja de estilo:
* {text-indent: 0px; margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {text-align: center}
#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 {background-color: white; width:280px; float: left}
#publicidad {background-color: white; 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 20px 0px 20px}
#navegacion ul { margin-left: 180px }
#contenido {background-color: orange ; text-align:left; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {background-color: yellow; width: 150px ; float:left ; margin: 3px 10px 3px 3px }
#menu li { list-style:none ; margin: 4px 0px 4px 6px }
#pie {background-color: white; border-left: black 1px solid ;
border-right: black 1px solid;
border-top: black 1px solid }
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ;
background-repeat: no-repeat ;
width:800px ;
height: 12px
overflow: hidden }
#menu h1 {}
a {color: brown ; text-decoration: none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration: underline ; background-color: silver }
a:active {}
saludos y gracias!!
He puesto, tal y como se indica en el curso, la propiedad de display block en el menú lateral (para que los enlaces salgan en hover sin necesidad de que el cursor esté encima de la palabra, sino sólo estando encima de la línea), pero no sé por qué no hay ninguna reacción xDD es como si no hubiera puesto nada...
Seguro que al final la solución es una tontería pero os agradecería mucho que me ayudárais porque la duda esta me está matando!! jajajaja
os pongo el codigo de la plantilla:
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">
<a href="index.html">
[contenido no disponible]
</a>
</div>
<div id="publicidad">Bienvenidos a mi web</div>
</div>
<div id="navegacion">
<ul>
<h1>Título sección 1</h1>
</div>
<div id="contenido">
<div id="menu">
<ul>
</div>
<h1>Este es un título de importancia Uno</h1>
Este es el contenido de mi página</p>
Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
<h2>Y este es el tercer párrafo.</h2>
En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.
Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p></div>
<div id="pie">Este es mi pie de página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
y el de mi hoja de estilo:
* {text-indent: 0px; margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {text-align: center}
#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 {background-color: white; width:280px; float: left}
#publicidad {background-color: white; 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 20px 0px 20px}
#navegacion ul { margin-left: 180px }
#contenido {background-color: orange ; text-align:left; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {background-color: yellow; width: 150px ; float:left ; margin: 3px 10px 3px 3px }
#menu li { list-style:none ; margin: 4px 0px 4px 6px }
#pie {background-color: white; border-left: black 1px solid ;
border-right: black 1px solid;
border-top: black 1px solid }
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ;
background-repeat: no-repeat ;
width:800px ;
height: 12px
overflow: hidden }
#menu h1 {}
a {color: brown ; text-decoration: none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration: underline ; background-color: silver }
a:active {}
saludos y gracias!!