Css:- fixed footer

The footer bottom property sets the bottom edge of an element to a unit above/below its normal position.

Code:-


<!DOCTYPE html> 
<html> 
<head> 
 <meta name="viewport" content="width=device-width, initial-scale=1"> 
 <style> 
  #footer { 
   position: fixed; 
   left: 0px; 
   bottom: 0px; 
   height: 30px; 
   width: 100%; 
   background: skyblue; 
  } 
 </style> 
</head> 
<body> 
 <div id="footer">genius Student</div> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
 <p>Paragraph 1</p> 
 <p>Paragraph 2</p> 
 <p>Paragraph 3</p> 
 <p>Paragraph 4</p> 
 <p>Paragraph 5</p> 
 <p>Paragraph 6</p> 
</body> 
</html> 
<!-- 
/* IE 6 */ 
* html #footer { 
   position:absolute; 
   top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px'); 
-->
Css:- fixed footer Css:- fixed footer Reviewed by Network security on May 23, 2019 Rating: 5

No comments:

Useful Information

Powered by Blogger.