Re: css difference between IE6 and FF?

cal
2007-11-09T23:45:11Z

The CSS validation passed with no errors.  Thanks for the useful
site.  Here''s a small html file which illustrates the issue.  In
firefox, all three lines are styled (no images, of course).  In IE,
only the div#Flash class defined first gets styled.  Thanks again for
your help.

-cal




#Flash {
  font-family: verdana, arial, helvetica, sans-serif;
  margin: 0;
  padding: 5px 5px 5px 30px;
}
div#Flash.notice {
  color: #060;
  background: url(/images/thumbs_up.gif) #E2F9E3 left no-repeat;
}

div#Flash.info {
  color: #559;
  background: url(/images/info.gif) #DDDDDD left no-repeat;
}
div#Flash.warning {
  color: #fff;
  background: url(/images/thumbs_down.gif) #C00000 left no-repeat;
}




This is a
warning
This is some
info
This is a
notice







On Nov 9, 6:12 pm, "Conrad Taylor"
<conra...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> Hi, you should be able to use the following to validate the CSS:
>
> http://jigsaw.w3.org/css-validator/
>
> Do you have a test HTML file that you can post that uses the below CSS?  In
> any case, it may be an issue with IE''s implementation of the CSS
> specification because the CSS validated with errors using a CSS
2.1validator.
>
> Good luck,
>
> -Conrad
>
> On 11/9/07, cal <lesb...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
>
>
>
> > Hi,
>
> > In my main css file, I have styled up various types of flash elements
> > as pasted below.  All three flash classes (notice, info, and warning)
> > render fine in FireFox, but only the first one defined is shown in
> > Internet Explorer.  I am sure that a CSS guru in the room can point
> > out the error of my ways...  Thanks!
>
> > -cal
>
> > --------------
>
> > #Flash {
> >   text-align: left;
> >   font-weight: bold;
> >   font-family: verdana, arial, helvetica, sans-serif;
> >   font-size: 100%;
> >   margin: 0;
> >   padding: 5px 5px 5px 30px;
> > }
>
> > div#Flash.notice {
> >   border-color: #9c9;
> >   color: #060;
> >   background: url(/images/thumbs_up.gif) #E2F9E3 left no-repeat;
> > }
>
> > div#Flash.info {
> >   border-color: #c99;
> >   color: #559;
> >   background: url(/images/info.gif) #DDDDDD left no-repeat;
> > }
>
> > div#Flash.warning {
> >   border-color: #c99;
> >   color: #fff;
> >   background: url(/images/thumbs_down.gif) #C00000 left no-repeat;
> > }