Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

HTML Forum


You are currently viewing our HTML Forum as a guest. Please register to participate.
Login



Post a Project »

Find a Professional HTML Freelancer!

Find a Freelancer to help you with your HTML projects

FREE Outsourcing eBook!

Reply
Old 06-26-2006, 09:56 PM Background trick
frofi's Avatar
Extreme Talker

Posts: 236
Location: London
Trades: 0
Is there a way how to stop the background image from repeating it self vertically? I want to use a trick where the background image is 1280px wide but ends level with the google ads. I can stop the repeat altogether but when the background image is only 10px wide I need it to repeat, so it fills the width of the screen. The rest would be just background color. In other words I want the repeat to stop after one row. Is it possible?
__________________
THE FORCE is with me at last! All I need now is some TALKUPATION ;)
frofi is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 06-26-2006, 10:21 PM Re: Background trick
Experienced Talker

Posts: 45
Trades: 0
I think I understand your question. You want to make the background repeat only once. so try this...

in your css file declare the background with an attribute of "no-repeat"

Now if you want that background to repeat to fill a certain random volume of horizontal space then stop the only solution I can think of is boxing in the background via a div.

Hope that helps. Maybe someone else can explain this better then I can.
auron is offline
Reply With Quote
View Public Profile
 
Old 06-27-2006, 12:30 AM Re: Background trick
vangogh's Avatar
Post Impressionist

Latest Blog Post:
Why Responsive Design?
Posts: 10,815
Name: Steven Bradley
Location: Boulder, Colorado
Trades: 0
You can use

background-repeat:repeat-x

so that the image will only repeat horizontally, but not vertically. Naturally there's a corresponding repeat-y value for the background-repeat property.
__________________
l Search Engine Friendly Web Design |
Please login or register to view this content. Registration is FREE

l Tips On Marketing, SEO, Design, and Development |
Please login or register to view this content. Registration is FREE

l
Please login or register to view this content. Registration is FREE
|
Please login or register to view this content. Registration is FREE
vangogh is offline
Reply With Quote
View Public Profile Visit vangogh's homepage!
 
Old 06-27-2006, 02:47 AM Re: Background trick
Extreme Talker

Posts: 170
Location: Canada
Trades: 0
This should help: http://www.w3schools.com/css/pr_background-repeat.asp

If for some reason your background image isn't quite right you can write your background code like this:
Code:
background: url(images/background.jpg) 0 10px repeat-x #fff;
The "0 10px" are horizontal and vertical positional values that will offset your background within an element. You can replace them with other pixel values, percentages, em values, whatever suits your design needs (I seem to use 50% 50% quite a bit).

After the positional values you have your repeat information telling the graphic only to repeat along the x axis. Then following that there is a color value. This color will fill up all the space that your background doesn't within the affected element. You can leave is blank if you want it to be transparent around your background image.

Hope that helps!
__________________

Please login or register to view this content. Registration is FREE



Please login or register to view this content. Registration is FREE

Last edited by collyer_1; 06-27-2006 at 02:56 AM..
collyer_1 is offline
Reply With Quote
View Public Profile Visit collyer_1's homepage!
 
Reply     « Reply to Background trick
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 1.17843 seconds with 12 queries