Fri, 2006-01-13 08:47
http://www.aussiesettlermotel.com.au
How can i set the y co-ordinates for the image in #content please?[/url]
Fri, 2006-01-13 08:52
#1
background image positioning
Try this:
#content{
background: url(flow.gif) no-repeat 830px xxpx;
}
You can set both x and y coordinates this way.
Fri, 2006-01-13 08:54
#2
background image positioning
background-position accepts two values the x and the y value so just have
background-position: xxxpx yyypx;
You might also want to consider a bit of shorthand.
#content
{
background: url(flow.gif) no-repeat 830px 300px;
}
Fri, 2006-01-13 09:01
#3
background image positioning
Thanks - so the first is always x? i've confused things by having a content and content2. the flower image changes ofcourse depending on the length of the page - my method is all wrong
PS: what's wrong with the doctype??? :!:
Fri, 2006-01-13 11:54
#4
background image positioning
There doesn't appear to be anything wrong with your doctype.
Fri, 2006-01-13 12:26
#5
background image positioning
Tyssen wrote:
Actually it should have a complete urlThere doesn't appear to be anything wrong with your doctype.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
instead of
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
Sat, 2006-01-14 02:51
#6
background image positioning
Thanks, I'll fix that.
Sat, 2006-01-14 03:03
#7
background image positioning
Triumph wrote:
Tyssen wrote:Actually it should have a complete urlThere doesn't appear to be anything wrong with your doctype.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
instead of
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
Oops! :oops:
Sun, 2006-01-15 09:48
#8
background image positioning
Ummmm - why am I seeing that top image stretch way off the screen?
Sun, 2006-01-15 10:22
#9
background image positioning
Because the OP has used a graphic that is 1600px wide and set it as a foreground image in a div that is only ~970px wide. image overflows it's div.
Chazza what are you trying to achieve here? it looks to me as though you should really set this graphic as a background image in a liquid div allowing for expansion of the width but setting a minimum width the page can reduce to.
Hugo.
Sun, 2006-01-15 10:48
#10
background image positioning
Apropo of the DocType chaps in actual fact an XHTML DTD with or without a URL but with the public identifier will switch on standards mode. the DTD used does in fact achieve CSS1compat mode in both IE6 and FF.
Hugo
Sun, 2006-01-15 10:55
#11
background image positioning
chazza wrote:
PS: what's wrong with the doctype??? :!:
You'll notice the only remark about a doctype is in my sig. Ah well 
Sun, 2006-01-15 11:43
#12
background image positioning
Anyway it's fixed, thanks
PS I don't like using background image for banners because there is no option for alt image text= greater accessibility or rather less depending on which way you look at it. I really don't care if my banner stretches to fit only that it can be read by anyone regardless of whether they want graphics or not.
Sun, 2006-01-15 14:00
#13
background image positioning
chazza wrote:
PS I don't like using background image for banners because there is no option for alt image text= greater accessibility or rather less depending on which way you look at it. I really don't care if my banner stretches to fit only that it can be read by anyone regardless of whether they want graphics or not.
<h1> Site Title Here</h1>
h1 {
text-indent: -9999em;
background: url(your-banner-here.gif) no-repeat 0 0;
}
It's called Image Replacement
Sun, 2006-01-15 14:04
#14
background image positioning
You could think about accessible image replacement techniques chazza, an alt atrrribute does not necessarily make it accessible and such a long piece of alt text is not really the right use of the attribute it's for a short description of the image your use is more akin to a longdesc.
You could move your H1 tag up and use it for a text title replaced with your image, then if images don't load you have a nice styled heading for your page.
Why though is your image so wide if you weren't intending to make use of the width and what do intend doing with that width? horizontal scrolling is not a desired feature of a web page.
Hugo.
Mon, 2006-01-16 00:59
#15
background image positioning
Good ideas, didn't know you could do that!
I'll give it a go when next I work on it.
Thanks.
As for space to the right - I just figured you'll have that anyway so who cares if your banner runs along with it until I saw a fluid banner with fixed content the other day but I will probably run into problems getting that right esp. if using bg image.
Mon, 2006-01-16 01:37
#16
background image positioning
Why not just crop the image?
For a motel I would have thought that you would have wanted your site to present well on PDAs and even mobile's and a big image like that is not going to help your site do that.
Mon, 2006-01-23 08:11
#17
background image positioning
Thanks but it's not my motel - I created it for a small amount of money - had it nearly finished when the owner decided to try uploading new stuff minus all my changes and deleted all my work by accident - now they won't pay me to fix it so I'm leaving it.