Hola a todos,
Estoy siguendo este tutorial de personalización de temas para Wordpress (que por cierto es muy bueno).
Este es el link del curso: https://www.youtube.com/watch?v=AShql_Ap1Yo&index=4&list=PLpcSpRrAaOaqMA4R dhSnnNcaqOVpX7qi5
Me quedo atascado en el minuto 8:13 del video.
El problema es que la linea que tendría que ir por debajo del header me esta quedando por encima del menu. Además, a la derecha del menu me queda el título del post más reciente (añado captura de pantalla para que se entienda mejor mi pregunta)
Imagen del problema: https://www.dropbox.com/s/1o5rk1ulz5onu6h/screenshot-wordpress.psd?dl=0
A continuación os pongo el código CSS y HTML + PHP.
CSS
Código:
body{
font-family: Arial, sans-serif ;
font-size: 14px;
color: #333;
}
a:link,
a:visited{
color: #006ec3;
}
p{
line-height: 1.65em;
}
/* General Layout */
div.container {
max-width: 920px;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
}
article.post{
border-bottom: 2px dotted #bbbbbb;
}
article.post:last-of-type {
border-bottom:none;
}
/* Header */
.site-header{
border-bottom: 2px solid #999;
margin-top: 100px;
}
/* Footer */
.site-footer{
margin-top: 30px;
border-top: 2px solid #999;
}
/* Navigation menus */
.site-nav ul {
margin: 0;
padding: 0;
}
.site-nav ul: before, .site-nav ul:after { content: ""; display: table; }
.site-nav ul: after { clear: both; }
.site-nav ul { *zoom: 1; }
.site-nav ul li {
list-style: none;
float: left;
float: top;
}
/* Site Header Menu */
.site-header nav ul li a:link,
.site-header nav ul li a:visited {
display: block;
padding: 10px 18px;
border: 1px solid #BBB;
border-bottom: none;
}
HTML + PHP
Código:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width">
<title><?php bloginfo('name'); ?> </title>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?> >
<div class="container">
<!-- site-header -->
<header class="site-header">
<h1><a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?> </a></h1>
<h5><?php bloginfo('description'); ?> </h5>
<nav class="site-nav">
<?php
$args = array(
'theme_location' => 'primary'
);
?>
<?php wp_nav_menu( $args ); ?>
</nav>
</header><!-- /site-header -->
Gracias por vuestra ayuda :)