Hi guys,
New to the board, and this is my first post!
I wrote this code:
<style type="text/css"> body { margin:0; padding:0; font: bold 11px/1.5em Verdana; position: absolute; height: auto; } h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #000; margin: 0px; padding: 0px 0px 0px 15px; } #tabsK { float:right; width:100%; background:#E7E5E2; font-size:93%; line-height:normal; border-bottom:0px solid #54545C; } #tabsK ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsK li { display:inline; margin:0; padding:0; } #tabsK a { float:left; background:url("tableftK.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsK a span { float:left; display:block; background:url("tabrightK.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsK a span {float:none;} /* End IE5-Mac hack */ #tabsK a:hover span { color:#FFF; background-position:100% -42px; } #tabsK a:hover { background-position:0% -42px; } #tabsK a:hover span { background-position:100% -42px; } #rectangle { float:left; width:100%; background:url("square.jpg") no-repeat left top; font-size:93%; line-height:inherit; border-bottom:0px solid #54545C; background-repeat: repeat-y; background-position:left; } </style>
The code at the bottom is not repeating on the y-axis. Anyone know the problem??!
#rectangle {
float:left;
width:100%;
background:url("square.jpg") no-repeat left top;
font-size:93%;
line-height:inherit;
border-bottom:0px solid #54545C;
background-repeat: repeat-y;
background-position:left;
}
Been trying to solve for couple hours now!
CSS Repeat-y?
Could you explain what it is that your trying to repeat along the y axis?
CSS Repeat-y?
Hi there,
I'm trying to repeat the square.jpg image.
Is this not the way to go about doing this?
The top code is just a CSS based menu.
The bottom code is just not repeating square.jpg for me!!
CSS Repeat-y?
Why have you got shorthand background properties for that image then? loose the last two properties and just style the image on the shorthand background declaration.
CSS Repeat-y?
Sorry, I'm pretty new to all this!
I've lost the last two properties, but nothing seems to have changed, i've even wrote the code with just the background repeat-y line, and deleted all other properties, but to no avail!
Anymore suggestions?
CSS Repeat-y?
background:url("square.jpg") no-repeat left top;
Why put a "no-repeat" in there if you want to repeat-y? That makes no sense at all.
Perhaps the shorthand overrides the background-repeat even though background-repeat comes later in the code.
CSS Repeat-y?
I have to put the no-repeat because the square.jpg will just keep on going left.
Any suggestions?
It can't be that difficult to find a code to go down the page?
Thanks!
CSS Repeat-y?
Are you just going to continue to ignore all of our suggestions? :roll:
CSS Repeat-y?
change the no-repeat to repeat-y - isn't that what you want?
CSS Repeat-y?
change the no-repeat to repeat-y - isn't that what you want?
CSS Repeat-y?
That is what I want it to do, i just saw my error!
My fault guys!
But...replaced with repeat-y, and nothing.
I'll try longcode!
CSS Repeat-y?
Maybe someone could try this code with an image they may have:
#rectangle {
float:left;
width:100%;
background:url("square.jpg");
background-repeat:repeat-y;
font-size:93%;
line-height:inherit;
border-bottom:0px solid #54545C;
}
and tell me where i'm going wrong!
It should work shouldn't it, but for me, nothing! Dreamweaver editor user BTW.
CSS Repeat-y?
do you have any content in this float?
CSS Repeat-y?
Nope, I removed the float, and still nothing to go by. Hmmmm...
CSS Repeat-y?
doubles, we're trying to help here, but you're not making it easy.
Hugo said to put the repeat-y in the shorthand background rule - do that. I even spelled it out for you.
Do NOT use Dreamweaver for testing. Use a text editor (or DW's code view only) and a real browser.
You have not given the float a height so if there is no content in this element there will be no height and therefor no background!
show us more code
CSS Repeat-y?
<head> <style type="text/css"> body { margin:0; padding:0; font: bold 11px/1.5em Verdana; position: relative; height: inherit; } h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #000; margin: 0px; padding: 0px 0px 0px 15px; } #tabsK { float:right; width:100%; background:#E7E5E2; font-size:93%; line-height:normal; border-bottom:0px solid #54545C; } #tabsK ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsK li { display:inline; margin:0; padding:0; } #tabsK a { float:left; background:url("tableftK.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsK a span { float:left; display:block; background:url("tabrightK.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsK a span {float:none;} /* End IE5-Mac hack */ #tabsK a:hover span { color:#FFF; background-position:100% -42px; } #tabsK a:hover { background-position:0% -42px; } #tabsK a:hover span { background-position:100% -42px; } #rectangle { background:url("square.jpg"); background-repeat:repeat-y; } #rectangle a span </style> </head>
That is the head...
And this is the DIV in the body...
<div id="rectangle"> <ul> </ul> </div>
CSS Repeat-y?
This is proving a struggle
doubles could you just style on the background property thusly:
#rectangle {
background: url(square.jpg) repeat-y;
}
Also for the sake of it can you add a fixed height to this div so that you know it's displaying.
Hugo.
CSS Repeat-y?
This is proving a struggle![]()

CSS Repeat-y?
your div is not showing. I bet it's as flat as a nickle.
try this;
#rectangle { background: url(square.jpg) repeat-y; height: 40px; width: 40px; border-width: 1px; border-style: solid; border-color: red; }
lol, a spellchecker.
CSS Repeat-y?
Hmm, which is why I mentioned:
"Also for the sake of it can you add a fixed height to this div so that you know it's displaying." earlier, along with the request to style on the background :roll:
CSS Repeat-y?
Yea I know, but I think he needs to hear things more than once before they're applied