•
•
•
•
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 403,299 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 3,828 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: 1374 | Replies: 6 | Solved
![]() |
•
•
Join Date: Feb 2006
Posts: 8
Reputation:
Rep Power: 0
Solved Threads: 0
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
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:
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>•
•
Join Date: Jan 2008
Location: Bali - Indonesia
Posts: 61
Reputation:
Rep Power: 1
Solved Threads: 8
#container
{
background-image: url(...) left top repeat;
}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 )
•
•
Join Date: Feb 2006
Posts: 8
Reputation:
Rep Power: 0
Solved Threads: 0
thanks for your reply,
however i tried background repeat but it still doesnt work..
if i specified the height, then everything is working but i want it to be dynamic according to my contents per page..
please help..
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 : May 6th, 2008 at 11:00 pm.
•
•
Join Date: Jan 2008
Location: Bali - Indonesia
Posts: 61
Reputation:
Rep Power: 1
Solved Threads: 8
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
adjust the position based on your need, but its better if u show ur entire page code (url maybe)
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)
•
•
Join Date: Feb 2006
Posts: 8
Reputation:
Rep Power: 0
Solved Threads: 0
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 =)
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 =)
•
•
Join Date: Feb 2006
Posts: 8
Reputation:
Rep Power: 0
Solved Threads: 0
•
•
•
•
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 : May 15th, 2008 at 12:09 am.
![]() |
•
•
•
•
•
•
•
•
DaniWeb HTML and CSS Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Similar Threads
- Firefox background-position problem solved (JavaScript / DHTML / AJAX)
- Child div's (faux columns) showing irregularly in FF (HTML and CSS)
- In navigation display:block; property is giving problem in IE6 (HTML and CSS)
- Placing one div within another (HTML and CSS)
- mac vs windows; help to resolve the problem (HTML and CSS)
- Background question (JavaScript / DHTML / AJAX)
- Bizarre CSS Behavior in Moz Without Border on Div (HTML and CSS)
- CSS browser compatibility ??? (HTML and CSS)
- Desktop background hijacked-NEW Problem (Web Browsers)
- Desktop Background Hijacked-NEW Problem(! Smart Security) (Viruses, Spyware and other Nasties)
Other Threads in the HTML and CSS Forum
- Previous Thread: what's the best css books?
- Next Thread: Do you know any good contact form script



Linear Mode