User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 332,617 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,189 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 369 | Replies: 6 | Solved
Reply
Join Date: Feb 2006
Posts: 7
Reputation: suchiate is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
suchiate suchiate is offline Offline
Newbie Poster

div repeat background problem

  #1  
14 Days Ago
hi guys,

i am currently facing one problem whereby i have a div container with a background-image and i want the background to automatically repeat as the inner divs contents expands. However, if i do not specify any height to the container, the background does not repeat at all even though the inner divs contents are expanding.

here's what i did

#container
{
    background-image: url(...);
}

#inner
{
    top: 10px;
    left: 25px;
    position: absolute;
}

when my contents in the inner div grows, the container background does not repeat to cover, i have also tried setting the container height to auto but it doesnt work, if i set height to 100 then it repeats the background for a 100px..

please help.. my html are as follows:

<div id="container">
    <div id="inner">
        the contents are all here
    </div>
</div>
AddThis Social Bookmark Button
Reply With Quote  
Join Date: Jan 2008
Location: Bali - Indonesia
Posts: 60
Reputation: rudevils is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 6
rudevils rudevils is offline Offline
Junior Poster in Training

Re: div repeat background problem

  #2  
12 Days Ago
#container
{
    background-image: url(...) left top repeat;
}
try it like that, ( adjust background position and repeat behavior base on your need )
in the code above your background will repeated to x and y, use repeat-x if you want your background repeated only in x (left to right)
Or use repeat-y if you want your background repeated only in y ( top to bottom )
If love is blind, why there's a bikini ??

Post your article at Bali Side Notes share your knowledge
Download punk mp3 for free | Download Classic Rock mp3 for free
Reply With Quote  
Join Date: Feb 2006
Posts: 7
Reputation: suchiate is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
suchiate suchiate is offline Offline
Newbie Poster

Re: div repeat background problem

  #3  
10 Days Ago
thanks for your reply,

however i tried background repeat but it still doesnt work..

#container{
	background-image: url("");
	background-color: White;
	background: left top repeat;
}

if i specified the height, then everything is working but i want it to be dynamic according to my contents per page..

please help..
Last edited by suchiate : 10 Days Ago at 11:00 pm.
Reply With Quote  
Join Date: Jan 2008
Location: Bali - Indonesia
Posts: 60
Reputation: rudevils is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 6
rudevils rudevils is offline Offline
Junior Poster in Training

Re: div repeat background problem

  #4  
9 Days Ago
mmm its strange ....
i think i need to see your page 1st
but u can try to add background to your body instead of #container like this
body{
	background-image: url("");
	background-color: white;
	background: center 100px repeat-y;
}

adjust the position based on your need, but its better if u show ur entire page code (url maybe)
If love is blind, why there's a bikini ??

Post your article at Bali Side Notes share your knowledge
Download punk mp3 for free | Download Classic Rock mp3 for free
Reply With Quote  
Join Date: Feb 2006
Posts: 7
Reputation: suchiate is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
suchiate suchiate is offline Offline
Newbie Poster

Re: div repeat background problem

  #5  
9 Days Ago
thanks for your continuous response rudevils,

however, i finally solved my problem, it was because of the positioning that i have set for my inner and container divs. my container was at relative and my inner was absolute. so i changed my container to absolute and left my inner div at default positioning (no value) and it worked.

I guess i am starting to get better understanding about css positioning. So sorry to crack your head on such a small problem but i really appreciate your help =)
Reply With Quote  
Join Date: Jan 2007
Posts: 2,219
Reputation: MidiMagic is an unknown quantity at this point 
Rep Power: 6
Solved Threads: 76
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Nearly a Posting Maven

Re: div repeat background problem

  #6  
7 Days Ago
Your background color is overriding the background image, because it is later in the stylesheet.
Daylight-saving time uses more gasoline
Reply With Quote  
Join Date: Feb 2006
Posts: 7
Reputation: suchiate is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
suchiate suchiate is offline Offline
Newbie Poster

Re: div repeat background problem

  #7  
2 Days Ago
Originally Posted by MidiMagic View Post
Your background color is overriding the background image, because it is later in the stylesheet.


MidiMagic, you are right. I just faced another problem not being able to repeat my background image as i really needed absolute positioning for my contents since i am not that professional a tableless website designer yet.

Then i came and revisit my post, which very luckily saw your post, and made me realized that the background color will override absolute positioning background image, really appreciate your help.

Thanks a million.
Last edited by suchiate : 2 Days Ago at 12:09 am.
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

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

 

DaniWeb HTML and CSS Marketplace
Thread Tools Display Modes

Similar Threads
Other Threads in the HTML and CSS Forum

All times are GMT -4. The time now is 1:49 am.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC