Hi benji01 and Welcome to webasterWold [webmasterworld.com].
I haven't clearly understood what you wanted to achieve can you be a bit more precise?
Hi benji 01
Le ber I think he wants text inside his background.
Benji01: write text ON your .gif picture inside Photoshop if you want text on that background, it's much simpler and will get the job done in 30 seconds flat
sorry what i meant is i have created a background image and linked it as a external css file which looks fine but i wanted to add text over the background on the far right using css i have tried using layout tables and cells but the text will still move when i prview in browser.
thank you for the very speedy responses guys.
Since you are building it for a specific size (800x600), you could use absolute positioning to get the text where you want it.
Is SEO_practioner idea possible or not (ie having the text on the BG).
If not, I think the best way is to create a 100% width table within which you could create another 800px width tabe and attach your bg to it. You then align this new table to the center (which will move according to the screen size hence your 800px table will always be in the middle). Now you just have to divide your 800px table into 2 colums and write your text in the right columns. You should also change the td code for the right column to <td background=""> otherwise in older NN browser your graphic will start again in the right section.
If you don't want the table to be centered in the browser windo, just get rid of the CSS style for the body and remove the 100% table.
Thankyou all very much for the help.
The last post is exaclty what i wanted centered image and now the text doesnt move when i preview thankyou alot..
i have been up all night trying everything and that is one thing i didnt try haha
2:29am at the mo time for bed (aus time)
god bless and thanks again
Really glad it helped.
See you around.
irk.. more tables for layout. Doesn't anyone on the CSS board actually use CSS? :)
Anyway, the CSS way to handle this is..
<body style="height:100%;background: #000022 url(yourpic.jpg) center center;">
<div style="position:absolute;top:0px;right:0px;width:50%;height:100%;border:1px solid black;">
Lots of text here.
Hope thats what you needed. Bit neater than those nasty old tables.
Obviously you can (and probably should) move the CSS to an external stylesheet instead. I've put a black border around where the text will go. To get rid of it just remove the 'border' settings on the div.
|irk.. more tables for layout. Doesn't anyone on the CSS board actually use CSS? :) |
Of course, everybody does but me, but as I test my site on NN4.7: layers are not an option ;)
I do like you too. I always test all my sites in IE 4.0 and up, then in Netscape 4.79 thru 7.02
That way, if there is a bug, I can see it right away. It's much longer but I find that it prevents us "nasty surprises"...
NN4 only accounts for 2% of the browsers out there. IE4 is about 1%. And those numbers are dropping all the time.
Stats from Browsernews [upsdell.com]
So I'd rather save myself the hassle and just write nice, clean standards-compliant code, rather than spend months tearing my hair out and using dodgy markup to satisfy a broken browser that will be dead soon. :)