Free Weekly Tech Newsletter

Dickies8 · 08-25-2003, 04:26 PM

i am trying to make a web page about me and some friends and i want to have pic that my g/f made to be the background but when i put it as the background it tiles and i want it right in the center of the page. i have tried a bunch of tags from different sites and nothing seems to work, am i missing something? here is some info that might help:

http://www.angelfire.com/theforce/redteamgo

^ (web page address)

Picture Information:

Name: background.jpg
Size: 797x480

i also have another one of the same pic but its dimensions are different, if someone could help me i would really appreciate it.
thanks!

chris1977uk · 08-26-2003, 09:44 AM

use a table, set it to 100% width and height, and use the image as the backgorund.

i think that will work!

**mairving** · 08-26-2003, 09:50 AM

The easiest is to use a stylesheet like so:

PHP Code:


			
<style>

Body {

background-image : url(/image_name);

background-repeat : no-repeat;

background-position : center;

}

</style>

Insert the style tags in the head section of your webpage and you are done.

Dickies8 · 08-26-2003, 10:51 AM

thank you ill give it a try and write back!

mjkovis · 08-26-2003, 03:31 PM

Quote:

Originally posted by mairving
The easiest is to use a stylesheet like so:

PHP Code:

<style> Body { background-image : url(/image_name); background-repeat : no-repeat; background-position : center; } </style>

Insert the style tags in the head section of your webpage and you are done.

Goodness! That is new stuff from when I did some HTML script in high school on my own web pages. I always thought that you could just center the graphic with the simple command...

**mairving** · 08-26-2003, 04:02 PM

Quote:

Originally posted by Acid-Klutch
Goodness! That is new stuff from when I did some HTML script in high school on my own web pages. I always thought that you could just center the graphic with the simple command...

You could center it horizontally but not vertically with the <center>. It would also not be a background image that other things could be placed on top of. You could also put it in the body tag but it would tile and not look so good.

mjkovis · 08-26-2003, 04:05 PM

Quote:

Originally posted by mairving
You could center it horizontally but not vertically with the <center>. It would also not be a background image that other things could be placed on top of. You could also put it in the body tag but it would tile and not look so good.

That is right. Forgot about that. Been like 3 or 4 years since I fooled around with HTML script. I was pretty good for being 14 when I started. Ended it my senior year in high school cause I just wanted to have too much fun! hehe

I think I mainly used table formats though to center my images and place them where I wanted them.

**mairving** · 08-26-2003, 04:12 PM

Quote:

Originally posted by Acid-Klutch
That is right. Forgot about that. Been like 3 or 4 years since I fooled around with HTML script. I was pretty good for being 14 when I started. Ended it my senior year in high school cause I just wanted to have too much fun! hehe

I think I mainly used table formats though to center my images and place them where I wanted them.

And you still could use table formats or combine it with CSS.

Dickies8 · 08-26-2003, 05:07 PM

i tried your suggestions, but it still tiles, i dont know how to use tables and such, if anyone would be as kind to post the code for a table that would center the image on the page so i could copy and paste it, i would be truley grateful..=)

chris1977uk · 08-27-2003, 03:34 AM

< table height="100%" width="100%" background="imagepath.jpg" border="0" >

< tr >
< td >
< body of page >
< /td >
< /tr >
< /table >

i think!!!

**mairving** · 08-27-2003, 06:49 AM

Quote:

Originally posted by Dickies8
i tried your suggestions, but it still tiles, i dont know how to use tables and such, if anyone would be as kind to post the code for a table that would center the image on the page so i could copy and paste it, i would be truley grateful..=)

Look here is an example that works. You may have to use the full path of your image.

PHP Code:


			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">



<html>

<head>

    <title>Test Page</title>

    

    <style>

Body {

background-image : url(http://www.m2hosts.com/images/m2hosts_com.gif);

background-repeat : no-repeat;

background-position : center;

}

</style>

    

</head>



<body>







</body>

</html>

Here is what it actually looks like.

Dickies8 · 08-27-2003, 03:14 PM

ill give it a try
thank you

Dickies8 · 08-27-2003, 03:30 PM

it works! i really freakin works! this forum is the shiznit! thanks guys for all the help!

Dickies8 · 08-27-2003, 09:51 PM

ok i got the image where i want it but not its leaving a white border around the right side and a orange-ish boarder on the bottom...i dont know what to do

chris1977uk · 08-28-2003, 03:29 AM

total guess but try

background-border : 0;

in there as well !!!

**mairving** · 08-28-2003, 05:19 AM

That's probably the image itself. Do you have something for us to look at.

08-25-2003, 04:26 PM	#1
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	Centering a Background image with HTML? i am trying to make a web page about me and some friends and i want to have pic that my g/f made to be the background but when i put it as the background it tiles and i want it right in the center of the page. i have tried a bunch of tags from different sites and nothing seems to work, am i missing something? here is some info that might help: http://www.angelfire.com/theforce/redteamgo ^ (web page address) Picture Information: Name: background.jpg Size: 797x480 i also have another one of the same pic but its dimensions are different, if someone could help me i would really appreciate it. thanks! Share Share this post on Digg Del.icio.us Technorati Twitter

08-26-2003, 09:44 AM	#2
chris1977uk Member (7 bit) Join Date: Sep 2002 Location: Middlesbrough, UK Posts: 108	use a table, set it to 100% width and height, and use the image as the backgorund. i think that will work! Share Share this post on Digg Del.icio.us Technorati Twitter

08-26-2003, 09:50 AM	#3
mairving Staff Premium Member Join Date: Jul 1999 Location: Arlington, TN Posts: 5,538	The easiest is to use a stylesheet like so: PHP Code: `<style> Body { background-image : url(/image_name); background-repeat : no-repeat; background-position : center; } </style>` Insert the style tags in the head section of your webpage and you are done. Share Share this post on Digg Del.icio.us Technorati Twitter

08-26-2003, 10:51 AM	#4
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	thank you ill give it a try and write back! Share Share this post on Digg Del.icio.us Technorati Twitter

08-26-2003, 05:07 PM	#9
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	i tried your suggestions, but it still tiles, i dont know how to use tables and such, if anyone would be as kind to post the code for a table that would center the image on the page so i could copy and paste it, i would be truley grateful..=) Share Share this post on Digg Del.icio.us Technorati Twitter

Need Some Help? Type Your Keywords Here:

Still Need Help? Type Your Keywords Here:

Free Weekly Tech Newsletter

08-27-2003, 03:34 AM	#10
chris1977uk Member (7 bit) Join Date: Sep 2002 Location: Middlesbrough, UK Posts: 108	< table height="100%" width="100%" background="imagepath.jpg" border="0" > < tr > < td > < body of page > < /td > < /tr > < /table > i think!!! Share Share this post on Digg Del.icio.us Technorati Twitter

08-27-2003, 03:14 PM	#12
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	ill give it a try thank you Share Share this post on Digg Del.icio.us Technorati Twitter

08-27-2003, 03:30 PM	#13
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	it works! i really freakin works! this forum is the shiznit! thanks guys for all the help! Share Share this post on Digg Del.icio.us Technorati Twitter

08-27-2003, 09:51 PM	#14
Dickies8 Member (6 bit) Join Date: Apr 2003 Location: Phoenix, NY Posts: 45	ok i got the image where i want it but not its leaving a white border around the right side and a orange-ish boarder on the bottom...i dont know what to do Share Share this post on Digg Del.icio.us Technorati Twitter

08-28-2003, 03:29 AM	#15
chris1977uk Member (7 bit) Join Date: Sep 2002 Location: Middlesbrough, UK Posts: 108	total guess but try background-border : 0; in there as well !!! Share Share this post on Digg Del.icio.us Technorati Twitter

08-28-2003, 05:19 AM	#16
mairving Staff Premium Member Join Date: Jul 1999 Location: Arlington, TN Posts: 5,538	That's probably the image itself. Do you have something for us to look at. Share Share this post on Digg Del.icio.us Technorati Twitter

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Subscribe to THE INSIDER

Need Some Help? Type Your Keywords Here:

Still Need Help? Type Your Keywords Here:

Free Weekly Tech Newsletter