I wanted to add a new utility bar at the top of my site that was fixed. Using Carrie Dils example with a small modification, I achieved what I wanted. Thanks Carrie.
Here are the additions I added:
style.css
And I had to make a small change to padding for the @media areas so the title had some distance between the green and the the text. Carrie's example included two sidebars, I only included one and stretched it to 100% in CSS.
read more...
Here are the additions I added:
style.css
.utility-bar {
background-color: #4cbb17;
border-bottom: 1px solid #ddd;
color: #ddd;
font-size: 12px;
font-size: 1.2rem;
padding: 10px 0;
padding: 1rem;
position: fixed;
width: 100%;
line-height: .5 !important;
z-index: 1;
}And I had to make a small change to padding for the @media areas so the title had some distance between the green and the the text. Carrie's example included two sidebars, I only included one and stretched it to 100% in CSS.
