Muy buenas, he empezado el curso de nuevo desde cero y me he topado con el primer problema en la lección 3, redondeando las formas de las div's. No me sale el redondeo superior, aunque la capa curva-superior existe, parece estar solapada por la cabecera. Os pongo el código de plantilla y de hoja de estilos.
PLANTILLA
</head>
<body>
<div id="global">
<div id="curva-superior">g</div>
<div id="cabecera">Bienvenidos a mi web</div>
<div id="navegacion">Barra de navegación</div>
<div id="contenido">
<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>
</ul>
</div>
<h1>Esta será la zona principal de la web</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur id lacinia enim. Nulla tristique augue et leo tincidunt luctus. Vivamus ultrices urna a ipsum cursus, sit amet pellentesque est tempor. Proin vitae vestibulum magna, vel viverra leo. Duis non velit sed mi ornare malesuada. Ut id odio ultrices, dapibus sem vel, rutrum dolor. Phasellus at hendrerit ligula. Sed ut nisl vel velit accumsan semper vel in massa. Nunc volutpat viverra imperdiet. Sed tempus eros et nisi pellentesque tempor. Donec vel eleifend lorem. Morbi vel turpis ultrices, pulvinar sapien a, tincidunt augue.</p>
<h2>Aenean laoreet turpis tellus, ut tempor</h2><p> lectus convallis sed. Sed sed ante porttitor, molestie lorem eu, ultrices nisi. Phasellus ut nisl nibh. Donec tincidunt a mi nec tempor. Nulla facilisi. Aliquam ut libero vitae enim placerat iaculis eu eu nisl. Phasellus lacinia diam nulla, id ullamcorper nulla suscipit vel. Morbi quis dui placerat, euismod sem et, fermentum libero. Fusce malesuada, augue nec adipiscing tempor, diam magna elementum est, eu condimentum erat elit quis justo. Donec sodales magna eget iaculis luctus. Duis facilisis lorem augue, vitae consectetur purus feugiat in. Suspendisse potenti. </p>
</div>
<div id="pie">Este es el pie de página</div>
</div>
</body>
</html>
HOJA DE ESTILOS
*{margin:0px; padding:0px; border:0px;}
a {color:brown; text-decoration:none; display:block}
a:link {}
a:visited {}
a:hover {color:red; font-size:1.2em; text-decoration:underline; background-color:silver}
a.active {}
body {text-align:center;}
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;}
#global {width:800px; margin:4px auto;}
#curva-superior {background-image:(objetos/curva-superior); background-repeat:no repeat; width:800px; height:12px; overflow:hidden;}
#cabecera {background-color:white; border-left:black 1px solid; boder-right:black 1px solid;}
He puesto hasta ahí para no saturar demasiado.
No me sale ni el borde derecho de cabecera ni el redondeo.
Gracias por vuestra ayuda
PLANTILLA
</head>
<body>
<div id="global">
<div id="curva-superior">g</div>
<div id="cabecera">Bienvenidos a mi web</div>
<div id="navegacion">Barra de navegación</div>
<div id="contenido">
<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>
</ul>
</div>
<h1>Esta será la zona principal de la web</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur id lacinia enim. Nulla tristique augue et leo tincidunt luctus. Vivamus ultrices urna a ipsum cursus, sit amet pellentesque est tempor. Proin vitae vestibulum magna, vel viverra leo. Duis non velit sed mi ornare malesuada. Ut id odio ultrices, dapibus sem vel, rutrum dolor. Phasellus at hendrerit ligula. Sed ut nisl vel velit accumsan semper vel in massa. Nunc volutpat viverra imperdiet. Sed tempus eros et nisi pellentesque tempor. Donec vel eleifend lorem. Morbi vel turpis ultrices, pulvinar sapien a, tincidunt augue.</p>
<h2>Aenean laoreet turpis tellus, ut tempor</h2><p> lectus convallis sed. Sed sed ante porttitor, molestie lorem eu, ultrices nisi. Phasellus ut nisl nibh. Donec tincidunt a mi nec tempor. Nulla facilisi. Aliquam ut libero vitae enim placerat iaculis eu eu nisl. Phasellus lacinia diam nulla, id ullamcorper nulla suscipit vel. Morbi quis dui placerat, euismod sem et, fermentum libero. Fusce malesuada, augue nec adipiscing tempor, diam magna elementum est, eu condimentum erat elit quis justo. Donec sodales magna eget iaculis luctus. Duis facilisis lorem augue, vitae consectetur purus feugiat in. Suspendisse potenti. </p>
</div>
<div id="pie">Este es el pie de página</div>
</div>
</body>
</html>
HOJA DE ESTILOS
*{margin:0px; padding:0px; border:0px;}
a {color:brown; text-decoration:none; display:block}
a:link {}
a:visited {}
a:hover {color:red; font-size:1.2em; text-decoration:underline; background-color:silver}
a.active {}
body {text-align:center;}
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;}
#global {width:800px; margin:4px auto;}
#curva-superior {background-image:(objetos/curva-superior); background-repeat:no repeat; width:800px; height:12px; overflow:hidden;}
#cabecera {background-color:white; border-left:black 1px solid; boder-right:black 1px solid;}
He puesto hasta ahí para no saturar demasiado.
No me sale ni el borde derecho de cabecera ni el redondeo.
Gracias por vuestra ayuda