background picture repeating

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
pleigh
Forum Contributor
Posts: 445
Joined: Wed Jan 19, 2005 4:26 am

background picture repeating

Post by pleigh »

hi there....is there a way i can control the background picture not to repeat?thnx
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

CSS

something like

Code: Select all

background-image:url(/images/jobdesc/adwgrid.gif);
	background-repeat:no-repeat;
User avatar
phpScott
DevNet Resident
Posts: 1206
Joined: Wed Oct 09, 2002 6:51 pm
Location: Keele, U.K.

Post by phpScott »

or even in your css

Code: Select all

body{
  background:url(/images/interface/body-bg.gif) no-repeat;
}
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Drifting *slightly* off-topic but when using no-repeat you often wish to have control over the position of the background.

Take a wild guess which CSS atrribute does that one :P

Code: Select all

body{
  background:url(/images/interface/body-bg.gif) no-repeat;
  background-position: top left;
}
http://www.w3schools.com/css/ is a nice resource by the way ;-)
User avatar
pleigh
Forum Contributor
Posts: 445
Joined: Wed Jan 19, 2005 4:26 am

Post by pleigh »

the image does not load....i edit my css file and put something like this

Code: Select all

body{
  background:url(/images/dome.jpg) no-repeat;
  background-position: top left;
}
User avatar
phpScott
DevNet Resident
Posts: 1206
Joined: Wed Oct 09, 2002 6:51 pm
Location: Keele, U.K.

Post by phpScott »

is the url to the image correct?
User avatar
pleigh
Forum Contributor
Posts: 445
Joined: Wed Jan 19, 2005 4:26 am

Post by pleigh »

thanks...yes, the url is correct...
User avatar
andre_c
Forum Contributor
Posts: 412
Joined: Sun Feb 29, 2004 6:49 pm
Location: Salt Lake City, Utah

Post by andre_c »

what element are you putting the background image on?
make sure the element has enough width to show the background picture
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

pleigh wrote:thanks...yes, the url is correct...
Are you sure? If you're using an external CSS file the path to the image needs to be relative to the CSS file, not the php script. So if your CSS is in a directory you'd need a "../" in the path..
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

onion2k wrote:
pleigh wrote:thanks...yes, the url is correct...
Are you sure? If you're using an external CSS file the path to the image needs to be relative to the CSS file, not the php script. So if your CSS is in a directory you'd need a "../" in the path..
not if he is using root relative paths, which i think he is
User avatar
wwwapu
Forum Contributor
Posts: 197
Joined: Wed Apr 07, 2004 11:57 am
Location: Turku, Finland

Post by wwwapu »

Try

Code: Select all

background:url(./images/dome.jpg) no-repeat;
One dot (.) means the current directory
User avatar
pleigh
Forum Contributor
Posts: 445
Joined: Wed Jan 19, 2005 4:26 am

Post by pleigh »

wwwapu wrote:Try

Code: Select all

background:url(./images/dome.jpg) no-repeat;
One dot (.) means the current directory
tried this one and still not working....i tried to call the css file to another page, but it is also not working....below is my css code for body{}

Code: Select all

body {
	background-image: url(/images/table.jpg) no-repeat;
	background-position: top right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px
}
User avatar
vigge89
Forum Regular
Posts: 875
Joined: Wed Jul 30, 2003 3:29 am
Location: Sweden

Post by vigge89 »

pleigh wrote:
wwwapu wrote:Try

Code: Select all

background:url(./images/dome.jpg) no-repeat;
One dot (.) means the current directory
tried this one and still not working....i tried to call the css file to another page, but it is also not working....below is my css code for body{}

Code: Select all

body {
	background-image: url(/images/table.jpg) no-repeat;
	background-position: top right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px
}
try:

Code: Select all

body {
	background: url(&quote;/images/table.jpg&quote;) no-repeat top right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Well the most foolproof way instead off cramming as much into one attribute to fix an issue is to break it up and see what causing the problem.

Code: Select all

background-image: url(/images/table.jpg);
background-repeat: no-repeat;
background-position: top right;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px
Post Reply