Fixed announce bar in HTML and CSS

Do you wish to show a fix message bar? Here is a super easy tutorial to show a fixed message bar at the bottom of the page in order to display an announcement, promotional offers or an important article recently published.

HTML code

<div id="dexbar">
    <strong>Don't miss out any post!</strong> <a href="#">Subscribe to our newsletter</a>
</div>

 CSS code

#dexbar{
  background: rgb(252, 70, 30);
  color: #fff;
  display: block;
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 10px 0px;
  text-align: center;
}

#dexbar a{ 
        color: #fff; 
        text-decoration:underline; 
        font-weight: normal; 
}
@media only screen and (max-width: 767px) {
    #dexbar{ 
        display: none;
    }
}