h1 width vs fixed div width
by rwone
HTML
<div id="mobile_wrapper">
<div id="mobile_menu">
menu
</div>
<div id="mobile_logo">
<img src="http://lorempixel.com/image_output/technics-q-c-150-50-6.jpg">
</div>
<ul id="mobile_cart">
<li>i</li>
<li>i</li>
</ul>
</div>
<h1>
TITLE
</h1>
CSS
#mobile_wrapper {
background: #000;
display: block;
position: fixed;
width: 95%;
white-space: nowrap;
z-index: 5;
box-sizing: border-box;
top:0;
left:0;
}
#mobile_menu {
background: aqua;
float: left;
display:inline-block;
position:static;
box-sizing:border-box;
width:60px;
}
#mobile_logo {
background: red;
float: left;
display:inline-block;
position:static;
box-sizing:border-box;
width: calc(100% - 120px);
text-align:center;
}
#mobile_logo img {
max-width: 100%;
vertical-align: bottom;
}
#mobile_cart {
width:60px;
background: green;
float: left;
display:inline-block;
position:static;
box-sizing:border-box;
margin:0;
padding:0;
text-align:right;
}
#mobile_cart li {
display: inline;
list-style: none;
}
h1 {
width: 95%;
background: gold;
display:inline-block;
position:static;
box-sizing:border-box;
margin-top: 50px;
text-align: center;
}