background-position defaults

background-position defaults

am 12.09.2007 15:55:20 von Shion

Hi

Suppose I have a 100px container and a 100x1 pixel background image that
I want to repeat-y down the container. My question is, can I be
confident that *all* browsers will position the background image at the
far left of the container if I omit any background-position property? Or
should I specify 'left' to be on the safe side?

So, IOW, if I do this:

#container {
width: 100px;
background: #FFF shadow.gif repeat-y;
}

Will shadow.gif definitely be positioned against the left edge of the
container div in every visual browser out there, or should I throw in a
'left':

background: #FFF shadow.gif left repeat-y;

Thanks!

Re: background-position defaults

am 12.09.2007 16:53:28 von jkorpela

Scripsit JL:

> ... can I be
> confident that *all* browsers will position the background image at
> the far left of the container if I omit any background-position
> property?

Theoretically, no, since browsers may have default values that differ from
the initial value for a property.

> Or should I specify 'left' to be on the safe side?

Why do you ask? If you want 'left', why don't you just say so in your CSS
code?

> So, IOW, if I do this:
>
> #container {
> width: 100px;
> background: #FFF shadow.gif repeat-y;
> }

That's syntactically incorrect, as a CSS checker like
http://jigsaw.w3.org/css-validator/
would have told you. You need to write e.g. url(shadow.gif) instead of just
shadow.gif.

But with this fixed, here you _are_ setting background-position (to 0% 0%,
which is equivalent to top left), since the background shorthand _always_
sets _all_ background properties.

>... should I throw in a 'left':
>
> background: #FFF shadow.gif left repeat-y;

That's a matter of taste; maybe it's more informative to someone reading the
CSS code. But it makes no difference in meaning.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/