Nav bar sub menu's

I want to make a sub menu but when i drag it a lil to the right in my menu creator it just goes straight underneath it and than i dont get a hover ??

Any 1 who can help me?

This is the code for my menu:

Code of my css:

/* nav menu's */

.site-nav ul{
	margin:0;
	padding:18px 10px;
	background-color: black;  

}

.site-nav ul:before .site-nav ul:after {content:""; display:table;}
.site-nav ul:after{clear:both;}

.site-nav ul li{
	list-style:none;
	display:inline;

}

/* Site Header Menu */

.site-header nav ul li a:link,
.site-header nav ul li a:visited{

	display:inline;
	line-height: 20px;
	padding:10px 18px;
	text-decoration: none;
	color:white;

}

.site-header nav ul li a:hover{
	background-color: white;
	color:black;

}

.site-header nav ul li.current-menu-item a:link,
.site-header nav ul li.current-menu-item a:visited{
	background-color: white;
	color:black;
}

Header.php

<nav class="site-nav">
				<?php
				$args =array(
					'theme_location' => 'primary'
					);
					?>
			<?php wp_nav_menu($args);?>
	</nav>

Functions.php

register_nav_menus(array(
'primary' => __('Primary Menu')
	));

Can some 1 tell me how i can fix this?:
This i get
Home
Winkel
Blog FaQ Locatie Contact

This i want

Home Blog Faq Locatie Contact
Winkel

Winkel shoud be a sub menu of Home that i want for a example

Would really appreciate it if u could tell me how i can fix this
Cheers alot ??