Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

fotter problem

Featured Replies

Hello,

 

I have a problem with a website i want the footer to be repeat but its not working i got it working with the header.

 

Anyone have any idea??

 

Here's the code??

 

 

HTML

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My Website</title>
<link rel="shortcut icon" href="favicon.png" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="style.css" type="text/css" rel="stylesheet" />
<link type="text/css" href="menu.css" rel="stylesheet" />
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript" src="menu.js">
</script>
</head>
<body>
<div id="wrapper">

<div id="topheader"></div>
<div id="header">
<div class="banner"></div>



       <div>

<div> </div>
<div id="container">
<div id="top_content"></div>
<div id="main_content">

<div id="content">
 <div align="center">
<img alt="Image" src="frount_page_images/image.jpg" height="470" width="665"/>
   </div>
 <div> <div align="center">
<p align="center" class="style9"><strong>Title</strong> </p>
</div></div> 

          <div> <div align="left">

		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a metus egestas ante rhoncus dictum. Nullam tortor erat, auctor sit amet, vehicula vitae, suscipit id, ipsum. Donec tempus orci ut massa. Sed vel lectus vel purus pretium gravida. Sed tempus, dui elementum porta fringilla, leo justo lacinia pede, ac rutrum diam velit ut dolor. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.

Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem. Fusce a diam ornare orci dignissim mattis. Praesent ultrices. Morbi sem.</p>




          </div>
          </div> 

<br />


</div>
</div>

<div id="bottom_content"></div>


<div id="footer">
<div id="footer-outer">
<div id="footer-in">
<div id="footer-left"><a href="http://www." target="_blank"> height="80" width="100" border="0" /></a></div>
<div id="footer-centre"><br />
<strong>Copyright ©2011 All Rights Reserved.</strong></div>
<div id="footer-right">
</div>

</div>
</div>
</div>
</body>
</html>

 



/* Footer */

#footer { 
margin: 0 auto;
height: 100px;
background:url(images/footer.jpg) repeat-x;	
}

#footer-left,#footer-right{ width:160px; height:45px; text-align:center; float:left;}
#footer-centre{width:400px; height:80px; text-align:center; float:left; font-size:12px;}
#footer-outer{height:60px; color:#000000;}
#footer-in{margin:0 auto; padding:15px 0 0 0; height:45px; width:720px; font-size:75%;}




}

I'm not quite sure what you mean, but if you are referring to the background image of the footer, the syntax for the shorthand background property is incorrect.

 

http://www.w3schools.com/css/css_background.asp

 

Bottommost example:

 

background: transparent url('images/footer.jpg') repeat-x left top;

 

You can swap out the "transparent" with a background color if you need to.

if you can show us the screen shot of your current site ,then we can understand what you need exactly and give u the correct guidelines

Edited by markupmypage

as porkchop says and to elaborate.....your image link needs to be in single quotes.

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.