Member Avatar for dinok

Hello people of daniweb. I'm new here :)

Anyways, I have issue with my css.

I have top picture which is exaclty of 570px height, and it has some gradient in it so it is not repeatable.
I have middle (or center) picture which is 1 px height and same width as top and bottom (912px) and I need to repeat it over y line.
I have bottom picture which is 7px height and of 912px width.

This is my html code:

<div id="newswrapper-repeater">
    <div id="newswrapper">
        // here goes text that should be long regarding the divs inside,
        // (news divs and stuff)
    </div>
</div>
<div id="newswrapper-bottom"></div>

This is my css code:

/* News wrapper and other is stored here*/
#newswrapper-repeater {
    background:url(images/newsbgrepeater.png) repeat-y;
    width:912px;
    min-height:571px;
    margin:auto;    
    margin-top:230px;
}
#newswrapper {
    position:absolute;
    background:url(images/newsbgtop.png) no-repeat;
    width:912px;
    min-height:571px;
    margin:auto;    
    margin-top:-10px;
}
#newswrapper-bottom {
    background:url(images/newsbgbottom.png) no-repeat;
    width:912px;
    min-height:7px;
    margin:auto;    
}

It now has as you see, a repeater div which is 230px from top, a normal news div with gradient image and its set to -10px margin to move from the repeating div, and the bottom one is there excluded from repeater div but after it.

The thing is, that div in middle is not repeating at all. Assistance needed!! :) Thanks!

Edited by dinok because: typo
  • 1 Contributor
  • 1 Reply
  • 186 Views
  • 30 Minutes Discussion Span
  • Latest Post Latest Post by dinok
Member Avatar for dinok 
position:absolute;

was issue, thanks :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.