How to stop Background imaging repeating?

spenno · 10-04-2006, 09:15 AM

Hi, Just wondering if anyone can help me stop my background image repeating. The image repeats on the right and beneath.

Many thanks

Bagi Zoltán · 10-04-2006, 09:56 AM

You should use this css background attribute:
"background-repeat:no-repeat;"

Intripita-MH · 10-04-2006, 01:08 PM

Quote:

Originally Posted by Bagi Zoltán

You should use this css background attribute:
"background-repeat:no-repeat;"

Yep.

More specifically:

body { background-repeat: no-repeat; }

Zack · 10-04-2006, 02:55 PM

Or use this way:

body {
background: #ffffff url(image.png) no-repeat;
}

if you wanted it to just repeat on the left side of the page:

body {
background: #ffffff url(image.png) repeat-y;
}

and if you wanted it to just repeat on the top of your page:

body {
background: #ffffff url(image.png) repeat-x;
}

Hope this helps you and the others who have this question!
HTMLGuy

Bagi Zoltán · 10-04-2006, 03:05 PM

So spenno as You see, there are lot of alternatives

Choose one!

spenno · 10-04-2006, 03:10 PM

should i use this in css.
thanks

spenno · 10-04-2006, 03:19 PM

this is my css:

/* CSS Document */

.links { font-family:arial; font-size:10px; font-weight:bold; color:#9D014B; text-decoration:none ;} a.links:hover { color:#073A74; }

.header-text {font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:bold; color:#9D014B; text-decoration:none;}

.address {font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#ffffff; text-decoration:none;}

.subheader-text {font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#9D014B; text-decoration:none;}

.text {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#073A74; text-decoration:none;}

.table-bg {background-color:#005793;}

#dropmenudiv{
position:absolute;
background-color: #ffffff;
border:1px solid black;
border-bottom-width: 0;
font:normal 10px arial;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
color: #073A74;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: #E8C4C6;
}

Can you tell me where to add it thanks

spenno · 10-04-2006, 03:20 PM

this is my css:

/* CSS Document */

.links { font-family:arial; font-size:10px; font-weight:bold; color:#9D014B; text-decoration:none ;} a.links:hover { color:#073A74; }

.header-text {font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:bold; color:#9D014B; text-decoration:none;}

.address {font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#ffffff; text-decoration:none;}

.subheader-text {font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#9D014B; text-decoration:none;}

.text {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#073A74; text-decoration:none;}

.table-bg {background-color:#005793;}

#dropmenudiv{
position:absolute;
background-color: #ffffff;
border:1px solid black;
border-bottom-width: 0;
font:normal 10px arial;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
color: #073A74;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: #E8C4C6;
}

Bagi Zoltán · 10-04-2006, 03:34 PM

When the picture, which repeats- is the background of the body, than You should attach a class attribute to it in the html code e.g. <body class="body">.

After this you should add some row into Your css document, something like this:
.body{
background: url(image.png) no-repeat;
}

spenno · 10-04-2006, 03:37 PM

Thanks a lot for that

10-04-2006, 09:15 AM	#1
spenno Junior Member Join Date: Jul 2006 Location: Derby Posts: 37	How to stop Background imaging repeating? Hi, Just wondering if anyone can help me stop my background image repeating. The image repeats on the right and beneath. Many thanks

10-04-2006, 09:56 AM	#2
Bagi Zoltán iWEBTOOL Moderator Contributor Join Date: Aug 2006 Location: Hungary Posts: 1,859	Re: How to stop Background imaging repeating? You should use this css background attribute: "background-repeat:no-repeat;" __________________ █ Time may come when you will need an excellent eCommerce shopping cart software █ free seo related web directory precíziós mérleg Free shopping cart

10-04-2006, 02:55 PM	#4
Zack Junior Guru Join Date: Dec 2005 Location: North Carolina Posts: 759	Re: How to stop Background imaging repeating? Or use this way: body { background: #ffffff url(image.png) no-repeat; } if you wanted it to just repeat on the left side of the page: body { background: #ffffff url(image.png) repeat-y; } and if you wanted it to just repeat on the top of your page: body { background: #ffffff url(image.png) repeat-x; } Hope this helps you and the others who have this question! HTMLGuy __________________ yaxal releases '07

10-04-2006, 03:05 PM	#5
Bagi Zoltán iWEBTOOL Moderator Contributor Join Date: Aug 2006 Location: Hungary Posts: 1,859	Re: How to stop Background imaging repeating? So spenno as You see, there are lot of alternatives Choose one! __________________ █ Time may come when you will need an excellent eCommerce shopping cart software █ free seo related web directory precíziós mérleg Free shopping cart

10-04-2006, 03:10 PM	#6
spenno Junior Member Join Date: Jul 2006 Location: Derby Posts: 37	Re: How to stop Background imaging repeating? should i use this in css. thanks

10-04-2006, 03:19 PM	#7
spenno Junior Member Join Date: Jul 2006 Location: Derby Posts: 37	Re: How to stop Background imaging repeating? this is my css: /* CSS Document / .links { font-family:arial; font-size:10px; font-weight:bold; color:#9D014B; text-decoration:none ;} a.links:hover { color:#073A74; } .header-text {font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:bold; color:#9D014B; text-decoration:none;} .address {font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#ffffff; text-decoration:none;} .subheader-text {font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#9D014B; text-decoration:none;} .text {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#073A74; text-decoration:none;} .table-bg {background-color:#005793;} #dropmenudiv{ position:absolute; background-color: #ffffff; border:1px solid black; border-bottom-width: 0; font:normal 10px arial; line-height:18px; z-index:100; } #dropmenudiv a{ width: 100%; display: block; color: #073A74; text-indent: 3px; border-bottom: 1px solid black; padding: 1px 0; text-decoration: none; font-weight: bold; } #dropmenudiv a:hover{ /hover background color*/ background-color: #E8C4C6; } Can you tell me where to add it thanks

10-04-2006, 03:20 PM	#8
spenno Junior Member Join Date: Jul 2006 Location: Derby Posts: 37	Re: How to stop Background imaging repeating? this is my css: /* CSS Document / .links { font-family:arial; font-size:10px; font-weight:bold; color:#9D014B; text-decoration:none ;} a.links:hover { color:#073A74; } .header-text {font-family:Arial, Helvetica, sans-serif; font-size:18px; font-weight:bold; color:#9D014B; text-decoration:none;} .address {font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#ffffff; text-decoration:none;} .subheader-text {font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#9D014B; text-decoration:none;} .text {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#073A74; text-decoration:none;} .table-bg {background-color:#005793;} #dropmenudiv{ position:absolute; background-color: #ffffff; border:1px solid black; border-bottom-width: 0; font:normal 10px arial; line-height:18px; z-index:100; } #dropmenudiv a{ width: 100%; display: block; color: #073A74; text-indent: 3px; border-bottom: 1px solid black; padding: 1px 0; text-decoration: none; font-weight: bold; } #dropmenudiv a:hover{ /hover background color*/ background-color: #E8C4C6; }

10-04-2006, 03:34 PM	#9
Bagi Zoltán iWEBTOOL Moderator Contributor Join Date: Aug 2006 Location: Hungary Posts: 1,859	Re: How to stop Background imaging repeating? When the picture, which repeats- is the background of the body, than You should attach a class attribute to it in the html code e.g. <body class="body">. After this you should add some row into Your css document, something like this: .body{ background: url(image.png) no-repeat; } __________________ █ Time may come when you will need an excellent eCommerce shopping cart software █ free seo related web directory precíziós mérleg Free shopping cart

10-04-2006, 03:37 PM	#10
spenno Junior Member Join Date: Jul 2006 Location: Derby Posts: 37	Re: How to stop Background imaging repeating? Thanks a lot for that

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

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

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Most Search users stop at page three	midlandi	Marketing and Promotion	0	11-16-2006 08:55 PM
Does .9 Repeating = 1?	Intripita-MH	General Talk	4	10-28-2006 09:41 PM
Background check record search, background search unlimited	davidfrank	Advertise your website	1	10-24-2006 01:55 AM
results repeating for each user	meth0d420	PHP	1	09-20-2006 07:53 AM
WebmasterTrades.com - Stop paying $9.95 to sell your site!	Skribblez	Advertise your website	0	04-21-2006 10:50 AM