background image expansion in a css file.

I read here: http://www.w3.org/TR/css3-background/
and took this under 'background-size'

Here are some examples. The first example stretches the background image
independently in both directions to completely cover the content area:

div {
background-image: url(plasma.png);
background-size: 100%;
background-origin: content}

to mean that the image would not tile and only show once taking up
the whole container, both vertically and horizontally.

Look here for my problem. http://www.texasflyfishers.org/newindex.htm

Those columns will be different length at different times. Is there a
better way to set the length to the conditions?

Running the css code thru the W3C css validate and I get 4 errors:
URI : http://texasflyfishers.org/newtff3col.css
69 #navigation Property background-size doesn't exist : 100%
70 #navigation Property background-origin doesn't exist : content
102 #rightcol Property background-size doesn't exist : 100%
103 #rightcol Property background-origin doesn't exist : content


--
A little rum in the morning coffee. Just to clear the cobwebs, ya know.

Re: background image expansion in a css file.

Dave Kelly wrote:
> I read here: http://www.w3.org/TR/css3-background/
> and took this under 'background-size'

Browser support for CSS3 is very limited. I don't know that any support
background-size yet.

> Running the css code thru the W3C css validate and I get 4 errors:
> URI : http://texasflyfishers.org/newtff3col.css
> 69 #navigation Property background-size doesn't exist : 100%

I think the validator defaults to checking against CSS 2.1, which of
course doesn't have these CSS3 properties.

--
Berg

Re: background image expansion in a css file.

Bergamot wrote:
> Dave Kelly wrote:
>> I read here: http://www.w3.org/TR/css3-background/
>> and took this under 'background-size'
>
> Browser support for CSS3 is very limited. I don't know that any support
> background-size yet.
>
>> Running the css code thru the W3C css validate and I get 4 errors:
>> URI : http://texasflyfishers.org/newtff3col.css
>> 69 #navigation Property background-size doesn't exist : 100%
>
> I think the validator defaults to checking against CSS 2.1, which of
> course doesn't have these CSS3 properties.

But one can specify CSS3, which for the OP's page yields
"Congratulations! No Error Found." (There is one warning.) So the
validator's happy, all you need to do now is get visitors to view your
page through the validator. ;-)

Personally, I still can't get to http://www.texasflyfishers.org/ or
http://texasflyfishers.org/ from where I am, so I can't comment/help
further.


--
John

Re: background image expansion in a css file.

In article <13e92hr5v010438@corp.supernews.com>,
Dave Kelly wrote:

> I read here: http://www.w3.org/TR/css3-background/
> and took this under 'background-size'
>
> Here are some examples. The first example stretches the background image
> independently in both directions to completely cover the content area:
>
> div {
> background-image: url(plasma.png);
> background-size: 100%;
> background-origin: content}
>
> to mean that the image would not tile and only show once taking up
> the whole container, both vertically and horizontally.
>
> Look here for my problem. http://www.texasflyfishers.org/newindex.htm
>
> Those columns will be different length at different times. Is there a
> better way to set the length to the conditions?
>
> Running the css code thru the W3C css validate and I get 4 errors:
> URI : http://texasflyfishers.org/newtff3col.css
> 69 #navigation Property background-size doesn't exist : 100%
> 70 #navigation Property background-origin doesn't exist : content
> 102 #rightcol Property background-size doesn't exist : 100%
> 103 #rightcol Property background-origin doesn't exist : content

This site is struggling badly with many problems, you are
tightrope walking and you really ought to consider two options at
this point. One, if you are really set on the look of this three
col as you have it but with the problems about background gone,
use a table and be done. Two, redesign things so you are not
requiring the things that are giving you problems, no point in
mentioning alternatives here unless you are open to them?

From an aesthetic point of view, it would be no big loss to be
rid of those repeating backgrounds for the side cols as they are
not exactly harmonious with the bg for the header (which is a
fair enough one I guess), it looks sort of like "someone has
decided to put in a background of a similar hue to above...". It
is "acceptable" perhaps, but not first rate. The pictorial
connection between the header and these col bgs is not natural or
good in any real sense. I am saying, in effect, you should not be
too wedded to them.

--
dorayme

Re: background image expansion in a css file.

Scripsit Bergamot:

> Dave Kelly wrote:
>> I read here: http://www.w3.org/TR/css3-background/
>> and took this under 'background-size'
>
> Browser support for CSS3 is very limited.

Besides, there is no CSS3, except as a hype buzzword for a mixed collection
of more or less sketchy drafts, most of which have remained at working draft
level for years.

I wonder how people regularly miss the disclaimers:
"This is a draft document and may be updated, replaced or obsoleted by other
documents at any time. It is inappropriate to cite this document as other
than work in progress."

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

Re: background image expansion in a css file.

On 2007-09-10, Dave Kelly wrote:
> I read here: http://www.w3.org/TR/css3-background/
> and took this under 'background-size'
>
> Here are some examples. The first example stretches the background image
> independently in both directions to completely cover the content area:
>
> div {
> background-image: url(plasma.png);
> background-size: 100%;
> background-origin: content}
>
> to mean that the image would not tile and only show once taking up
> the whole container, both vertically and horizontally.

>
> Look here for my problem. http://www.texasflyfishers.org/newindex.htm
>
> Those columns will be different length at different times. Is there a
> better way to set the length to the conditions?
>
> Running the css code thru the W3C css validate and I get 4 errors:
> URI : http://texasflyfishers.org/newtff3col.css
> 69 #navigation Property background-size doesn't exist : 100%
> 70 #navigation Property background-origin doesn't exist : content
> 102 #rightcol Property background-size doesn't exist : 100%
> 103 #rightcol Property background-origin doesn't exist : content

The problem is that background-size is CSS 3 and the W3C css validator
is working against (probably) 2.1, as are most people's browsers.

There's no background-size in CSS 2.1 and no way to stretch background
images. You have to use an if you want to stretch it.

Re: background image expansion in a css file.

On 2007-09-10, Jukka K. Korpela wrote:
[...]
> Besides, there is no CSS3, except as a hype buzzword for a mixed collection
> of more or less sketchy drafts, most of which have remained at working draft
> level for years.
>
> I wonder how people regularly miss the disclaimers:
> "This is a draft document and may be updated, replaced or obsoleted by other
> documents at any time. It is inappropriate to cite this document as other
> than work in progress."

You get that disclaimer on the CSS 2.1 draft specification too, but CSS
2.1 is widely almost implemented and almost understood by designers.

So the disclaimer doesn't tell people much of what they want to know for
practical purposes-- i.e. will something work.

Re: background image expansion in a css file.

Ben C wrote:
> On 2007-09-10, Jukka K. Korpela wrote:
>>
>> I wonder how people regularly miss the disclaimers:
>> "This is a draft document and may be updated, replaced or obsoleted by other
>> documents at any time. It is inappropriate to cite this document as other
>> than work in progress."
>
> You get that disclaimer on the CSS 2.1 draft specification too, but CSS
> 2.1 is widely almost implemented and almost understood by designers.

This makes a great slogan for the effort to standardize Web styling:

"The version before last: Now widely almost implemented and almost
understood by designers!"

The W3C should use this more in their marketing/evangelism efforts.

:-P

--
John

Re: background image expansion in a css file.

Scripsit John Hosking:

> This makes a great slogan for the effort to standardize Web styling:
>
> "The version before last: Now widely almost implemented and almost
> understood by designers!"

And implementors could use similar style in advertizing the implementations:
"Almost strictly standard, with a lot of useful extensions especially for
you!"

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