Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Newbie Text Alignment question

Status
Not open for further replies.
peterv6

peterv6

Programmer
Sep 10, 2005
70
US
Is there a way to use CSS to create a "footer" for a web page? I want to print the output from the bold red lines below at the bottom of my web page.

The other problem involves the page's background image. Is there a way to make the background image expand & contract depending on how the user resizes the browser window? If so, I'd really appreciate it if someone would be willing to share that with me.

Webpage:
<HEAD>
<TITLE>Page Title</TITLE>
</HEAD>
<html><body class=body>
<hr WIDTH="100%" >
<center>
<font class=font>
Last updated Saturday, August 23, 2008 - 12:52 AM<br>
<b><i>my test footer</i></b> &copy; 2008<br>
<A class=menu2 href=" Webmaster</A>
</font>
</center>
<hr WIDTH="100%" >
</body></html>

Style sheet:
body {
background-image: url(../images/Ontario.png);
background-position: center center;
background-repeat: no-repeat;
}
font {
font-size: x-small;
color: yellow;
font-family: arial;
hr {
color: yellow;
height: 1px;
}


PETERV
Syracuse, NY &
Boston, MA
 
Sort by date Sort by votes
Not really sure what you are asking here.
Code: 
I want to print the output from the bold red lines below at the bottom of my web page.
Put it at the bottom of your web page.
If you have many pages requiring the same footer, consider using some server side scripting to make dynamic pages, that way you only create a single footer.


The size of the background image is set and cannot be resized without some complex coding. One solution would be to make your image fill a left hand section of your page but without seeing what you are trying to do, it is impossible to make suggestions.

Keith
 
Upvote 0 Downvote
What I want to do is have one image for the background. The way it is now, the top left 75% of the page is one copy of the image, and of course the rest of the page consists of 3 "segments" of the same image. All I want is one image for the entire background. Any way to do it?

PETERV
Syracuse, NY &
Boston, MA
 
Upvote 0 Downvote
Are you saying the page is tiled? Or are you saying the code placed the images like that in the background?
 
Upvote 0 Downvote
I would suggest you build your page so that the body has a background colour that matches the photo, put the photo in the centre of the viewport and have it not be repeated (you can do that easily with CSS) and call it even.

As for the footer. I wonder if you really want to do that. It is not so straightforward to put elements at the bottom of the screen (your best bet would be absolute positioning, which in itself brings a lot of issues) and if your website is viewed on a large screen (say 1900x1200 resolution), the footer might be very far from everything else and just look weird.

I strongly encourage you to just put the footer at the end of the actual content of the page. I think that will cause you a lot less headaches than positioning things globally according to the viewport -- which varies drastically on different screen sizes.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
Upvote 0 Downvote
Unless you want you image to be trimmed by the browser you obviously can't have your picture covering the whole browser window without distortion, as browser window aspect ratio is in the control of your user. If you're happy to have the image trimmed, then simply use a considerably larger image. Bear in mind that your image is already over 1Mb, so will load slowly on dial-up even before you resize it, unless you compress it more.

The image is tiled because it is set as background, not as an image, and the default for background-repeat is to repeat. See
Unless you're sure that all your users are on fast broadband connections I would advise against huge complex background images, From an aesthetic point of view, I would advise against it anyway!

___________________________________________________________
If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller
Steam Engine Prints
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

waubain
  • Locked
  • Question
Prevent user from getting a 404 error if click on a hover text displaying a hidden image. 1
Replies
5
Views
158
jjgupta915
jjgupta915
jason.lex
  • Locked
  • Question
Bootstrap grid and columns question
Replies
0
Views
71
jason.lex
jason.lex
coldbohemia
  • Locked
  • Question
I'm inserting a text file into a we
Replies
2
Views
117
coldbohemia
coldbohemia
pendle666
  • Locked
  • Question
Inserting same line of text of every web page - &quot;link&quot; insert? 1
Replies
6
Views
143
ChrisHirst
ChrisHirst
lupidol
  • Locked
  • Question
What does a question mark (?) stands for in ancho tag ? 1
Replies
2
Views
269
lupidol
lupidol

Part and Inventory Search

Sponsor

Back
Top