in reply to Re^3: cgi and css, body tag not recognize
in thread cgi and css, body tag not recognize

I did
perl -MCGI index.cgi > test.html
this is index.cgi
#!/usr/bin/perl -w use strict; use diagnostics; use CGI; use CGI::Carp qw(fatalsToBrowser warningsToBrowser); use CGI::Pretty; use DBI; warningsToBrowser(1); my $q = CGI->new(); my $title = "mt Annotation pipeline"; print $q->header(), $q -> start_html(-title => "$title", -style => { -src => 'mycss/mtannot.css', -type + => 'text/css', -media => 'screen' }), $q->div({-class=>"header"},$title), $q->div({-style=>"float: left"}, $q->div({-class=>"menu"}, $q->h3("menu"), ("here is some text"), $q->br(), ("spanning two lines") ), ), $q->div({-class=>"content"}, $q->h1('First Upload your sequence'), $q->table ( {bgColor=> "blue", -border=>1}, $q->TR([ $q->td("1") . $q->td("A") . $q->td("2") . $q->td("B" +), ]), $q->TR([ $q->td("1") . $q->td("A") . $q->td("2") . $q->td("B" +), ]), ), ), $q -> end_html();
and this is the css file:
BODY { background-color: #0e7aef; color: white; font-family: sans-serif; background: url(images/vbc.jpg) no-repeat fixed top right; } LI { margin-bottom: 1ex; } H1 { color:black; } .header { font-size: 4em; border: solid thin black; background-color: #8B475D; text-align: center; padding-top: 0px; margin: 0px 0px 10px 0px; color: #7FFF00; width: 90%; } .content { margin-left: 16em; padding: 1em 1em 1em 1em; background-color: #eee; border: solid thin black; width: 75%; } .menu { background-color: #b3d5ff; width: 15em; border: solid thin black; text-align: center; color: black; }
How do you change the body' background-color in your css?

Replies are listed 'Best First'.
Re^5: cgi and css, body tag not recognize
by Joost (Canon) on Jun 14, 2007 at 21:14 UTC
    I note that that's a different css and html from the one you posted first. But at least we're getting somewhere now.

    probably your background image url isn't valid. It works fine without the  background: url(images/vbc.jpg) no-repeat fixed top right; line.

    update: note that urls in a CSS file are relative to the location of the CSS, not to the location of the calling HTML file.

Re^5: cgi and css, body tag not recognize
by ww (Archbishop) on Jun 14, 2007 at 21:35 UTC

    Aside from the capitalization in the css, already mentioned, it appears to me that your background-image is correct. Fuji doesn't object, in any case, to the single line, and blesses whole body section:

    Valid CSS information BODY { background-color : #0e7aef; color : white; font-family : sans-serif; background : url(images/vbc.jpg) no-repeat fixed top right; }

    HOWEVER, I believe the standard form is:
    body {background-image: url(./gfx/ban_btm.jpg);background-repeat: repeat-x;}

    ...at least, that passes both the w3c html and css validators for me... and another of each, run locally. It also gives no offense to htmlTIDY

    w3c, for example, reports: W3C CSS Validator Results for file://localhost/TextArea Valid CSS information body { background-image : url(./gfx/ban_btm.jpg); background-repeat : repeat-x; }

    Now, if I am correct, your

    background: url(images/vbc.jpg) no-repeat fixed top right;

    could, conceivably, be masking the background-color declaration above, in a non-compliant browser.

    Be it noted, I believe essentially ALL browsers are non-compliant to some extent or another -- even Amaya and other supposedly "gold-standard" browsers, developed not so much for real-world use, as for testing.

    With that bias of mine in mind, you might try sticking that background in one of your existing <div>s... and see what happens to that. In fact, it might be instructive to try the variation of locating it at several different lines of the style declaration.

    If you opt for this, please tell us what happens... and with (also already mentioned), which browser?

    Update: Oops. Fixed spelling of "Fuji" and UNborked my </tt>...</tt> in first line of this node.