Reveal menu on hover (incomplete)

by jim ulle

HTML

<div class="menu">
<div id="menuimg"></div>
<span>
<ul>
<li>portfolio.</li>
<li>about.</li>
<li>contact.</li>
</ul>
</span>
<div id="logo"><img src="img/logo1.svg" height="100px" width="100px"></div>

</div>

CSS

#menuimg {
    position:absolute;
    width:50px;
    height:50px;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    top:50px;
    background:url(../img/menuimgU.png) no-repeat;
    transition:all .5s;
    background-color: black;
}

.menu {
    position:fixed;
    height:100%;
    width:150px;
    left:0;
    background:#fff;
    -webkit-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    3px 0px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow:         3px 0px 5px 0px rgba(50, 50, 50, 0.75);
transition:all .5s;}

.menu:hover {
    height:100%;
    width:225px;
}

span {
    position:relative;
    display:none;
}

#menuimg:hover~span {
    display:inline;
}
span:hover {
    display:inline;
}