Donde pone Inicio, Parte de en medio-1, Parte de en medio-2 y Final no me aparece lo que yo quiero (recuadros con bordes redondeados). ¿Por queee?
Código 1, en HTML
<!Doctype html>
<html lang="es">
<head>
<title>Pagina de prueba para repasar lo que aprendí tiempo atras</title>
<meta charset='utf-8'>
<LINK rel="plantillas" href="plantillasSm.css" type="text/css">
</head>
<script type="text/javascript">
</script>
<body>
<div id='contenido'>
<header>
<hgroup>
<h1>rellenando plantilla, tututututú. No me gusta la papilla, tututututú. Yeeah!! (8)</h1>
</hgroup>
<nav>
<p class="indiceizquierdo">Inicio</p>
<p class="indicecentral">Parte de en medio-1</p>
<p class="indicecentral">Parte de en medio-2</p>
<p class="indicederecho">Final</p>
</nav>
</header>
<section>
<div id='textoprincipal'>
<article>
<hgroup>
<h1>Introduccion</h1>
</hgroup>
<p>
LALALALALALALALALATEXTOOOOOOOOOOOOOOOOLALALALALAAAAAAAAAAAAAALLLLLLLLLLLAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAATTTTTTTTTTTTTTEEEEEEEE
EEEEEEEEEEEXXXXXXXTTTTTTTTTOOOOOOOOOOOOOOOOOOOOOOOOOOOOYASEMEOCURRIRAQUEPONERCUANDOMETOQUEHACERLOBIEEEEN
</p>
</article>
<aside>
<p>Sigeme en tuenti</p>
<p>Sigeme en twitter</p>
<p>Sigeme en facebook</p>
<p>Ni se te ocurra seguirme en la vida real</p>
<p>Mira mis videos en youtube</p>
<p>Mira mis telarañas en myspace</p>
</aside>
</div>
</section>
</div>
</body>
</html>
Código 2, CSS
.indiceizquierdo {
border:inherit 3px #fafafa;
-moz-border-radius-topleft: 65px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:65px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:65px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:65px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:65px;
border-top-right-radius:5px;
border-bottom-left-radius:65px;
border-bottom-right-radius:5px;
}
.indicecentral {
border:inherit 5px #000000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
}
.indicederecho {
border:dashed 5px #000000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:65px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:65px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:65px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:65px;
border-top-left-radius:5px;
border-top-right-radius:65px;
border-bottom-left-radius:5px;
border-bottom-right-radius:65px;
}
En serio, no veo el error, será alguna tonteria. Ayudadme por favor.
Un saludo!!
si te fijas en .indiceizquierdo e .indicecentral el border-style es inherit y no está permitido.
Solo tienes que seleccionar el estilo del borde ;)
border:#fafafa solid 3px ;
border-radius:5px 65px 5px 65px;
Muchas gracias, ahora lo corrijo.