I'm having trouble figuring out why my links are not working for the .pushMenu divs on the left and right side,
html:
<header class="header">
<div class="pushMenu" id="left">
<a href="" title=""><p>l</p></a>
</div>
<div class="pushMenu" id="right">
<a href="" title=""><p>r</p></a>
</div>
<div>
<span class="myTitle">title</span>
<span class="myBy">(by me)</span>
</div>
css:
header {
text-align: center !important;
line-height: 60px;
font-weight: bold;
position: absolute;
top: 0; left: 0; right: 0;
height: 60px;
color: #ffffff;
}
header div.pushMenu {
position: absolute;
width: 30px;
height: 30px;
top: 10px;
border: 1px solid white;
}
header div.pushMenu#left {left: 10px;}
header div.pushMenu#right {right: 10px;}
header div.pushMenu a {
width: 30px;
height: 30px;
display: block;
}
see in action: http://jsfiddle.net/GDQdU/4/
what could be causing this issue?