Fixed Footer buttons - HTML CSS CSS Widget

HTML CSS examples for CSS Widget:Footer

  1. HOME
  2. HTML CSS
  3. CSS Widget
  4. Footer

Description

Fixed Footer buttons

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style id="compiled-css" type="text/css">

#buton{<!-- w w w.  j  av a 2  s .  c o  m-->
   text-align:right;
   bottom:0;
   position: fixed;
   width: 100%;
   z-index: 100;
}
.myButton {
   background-color:#008AE6;
   display:inline-block;
   cursor:pointer;
   color:#ffffff;
   font-family:arial;
   font-size:12px;
   padding:6px 21px;
   text-decoration:none;
   text-shadow:0px 0px 0px #ffffff;
}
.myButton:active {
   position:relative;
   top:1px;
}
.myButton2 {
   background-color:#008AE6;
   display:inline-block;
   cursor:pointer;
   color:#ffffff;
   font-family:arial;
   font-size:12px;
   padding:6px 21px;
   text-decoration:none;
   text-shadow:0px 0px 0px #ffffff;
}
.myButton:active {
   position:relative;
   top:1px;
}
.myButton3 {
   background-color:#008AE6;
   display:inline-block;
   cursor:pointer;
   color:#ffffff;
   font-family:arial;
   font-size:12px;
   padding:6px 21px;
   text-decoration:none;
   text-shadow:0px 0px 0px #ffffff;
}
.myButton:active {
   position:relative;
   top:1px;
}
hr{height:0;
border:0;
border-top:1px solid #008AE6;}


      </style> 
 </head> 
 <body> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <p>1</p> 
  <p>2</p> 
  <br> 
  <br> 
  <div id="buton"> 
   <hr> 
   <a href="#" class="myButton">Submit</a> 
   <a href="#" class="myButton2">Save</a> 
   <a href="#" class="myButton3">Cancel</a> 
  </div>  
 </body>
</html>

Related Tutorials