I achieved the layout you are after by adding width :100%
and float: right
to #subHeader
. I also added float: right
to .mobileMenu li
and removed the margin
attributes of .menlink
. Please see below changes and jsfiddle...
#subHeader{
background: #c1c1ab;
width: 100%;
color: #1a1a15;
float: right;
}
.mobileMenu li{
display: inline-block;
float: right;
font: bold 1.2em/1.5em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
margin-right: 4px;
}
.menLink {
background:url("http://tinyurl.com/kgd7ayt") no-repeat;
height: 3em;
width: 3em;
}
.menLink a {
text-indent:-9999px;
display:block;
height: 3em;
width: 3em;
}