View Full Version : Reposition the image that repeats along the x-axis

09-22-2007, 03:00 PM
I have used CSS to diplsy images around my text
However the topband (repeat-x) is rather too much on top (of what i have in mind)
I want this to be positioned just adjacent to the first yellow band ( repeat-y)
Please see attched txt file and jpg file

Plase save the txt file as html to view the image positioning

Left me know if i have not made myself clear

the text that is being enclosed may be just a few lines or 1-3 paragraphs.. hence i cannot use a "fixed" picture
So the yellow band seen is infact a repeated image (repeat-y)
while the top band is also a repeat-x image

What do think,.. would it be possible to reposition my topband img ( small rect in a grey background) at the position indicated in the jpeg and then repeat it along the x axis ? ? ?

Any help is great help
thanks in advance

09-22-2007, 03:32 PM
Your code is far from semantic (http://www.boagworld.com/archives/2005/11/semantic_code_what_why_how.html) and also it doesn’t really help us to help you because we don’t see what actually is the image you are talking about (no file name, no comment, nothing indicates it). The best would be if you uploaded your page somewhere for us to look at and there we can also inspect your source code (and FYI: using the small '#' button in the reply window you can post your code here rather than attaching it as file).

What I do see is that you are only using top, left, right, center, bottom values for the image position. There’s more than that. You can use any numeric value and any unit that is allowed in web development (i.e. em, px, cm, in, %, …) to position your image exactly where you want. For example background-position: 10px 20px; would offset the image by 10px from the left and 20px from the top.

Also, to get you started on proper coding: your document is lacking a doctype declaration (http://www.alistapart.com/articles/doctype/). And only use HTML or XHTML strict.

09-23-2007, 04:59 AM
Thank you sooo much for the links and

background-position: 10px 20px .. i did not know about this
i will read though the links and getback to you

Thank you gain