Re: css difference between IE6 and FF?

cal
2007-11-10T00:46:51Z

D''oh.  Three div''s in a row with the same id.  I suppose that
if one
stares at one own flaws long enough, they disappear....

Thanks a bunch.

-cal

On Nov 9, 7:16 pm, "Conrad Taylor"
<conra...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
>         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
>
>
> An XHTML 1.0 Strict standard template
>     <meta http-equiv="content-type"
>         content="text/html;charset=utf-8" />
>     <meta http-equiv="Content-Style-Type"
content="text/css" />
>
>
> #Flash {
>  font-family: verdana, arial, helvetica, sans-serif;
>  margin: 0;
>  padding: 5px 5px 5px 30px;
>
> }
>
> div.notice {
>  color: #060;
>  background: url(/images/thumbs_up.gif) #E2F9E3 left no-repeat;
>
> }
>
> div.info {
>  color: #559;
>  background: url(/images/info.gif) #DDDDDD left no-repeat;}
>
> div.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 11/9/07, Conrad Taylor
<conra...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
>
>
> > Hi, here''s an updated file.  The other issue is that you have
an id,
> > flasharea, in the HTML code but it doesn''t appear in your
CSS.  Finally, the
> > below code validates successfully.
>
> > Good luck,
>
> > -Conrad
>
> > BEGIN CODE:
>
> > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> >
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> > <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
>
> >
> > An XHTML 1.0 Strict standard template
> >     <meta http-equiv="content-type"
> >         content="text/html;charset=utf-8" />
> >     <meta http-equiv="Content-Style-Type"
content="text/css" />
> >
>
> > #Flash {
> >  font-family: verdana, arial, helvetica, sans-serif;
> >  margin: 0;
> >  padding: 5px 5px 5px 30px;
> > }
>
> > div#.notice {
> >  color: #060;
> >  background: url(/images/thumbs_up.gif) #E2F9E3 left no-repeat;
> > }
>
> > div.info {
> >  color: #559;
> >  background: url(/images/info.gif) #DDDDDD left no-repeat;
> > }
> > div.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
> >
> >
> >
>
> > END CODE:
>
> > On 11/9/07, Rob Biedenharn
<R...-GBZH0y1GwQfnZcttdmLDtcI/UQi/AW5J@public.gmane.org> wrote:
>
> > > You aren''t supposed to have more than one element with a
given ID
> > > attribute.  If you swap ID for CLASS in your code and selector
rules,
> > > I suspect you''ll get what you want.
>
> > > -Rob
>
> > > On Nov 9, 2007, at 6:45 PM, cal wrote:
> > > > 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;
> > > > }
> > > >
> > > >
> > > >
> > > > <div id="flasharea" style="top:
3px;">
> > > > <div id="Flash"
class="warning">This is a warning
> > > > This
is some info
> > > > <div id="Flash"
class="notice">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
>
> > > Rob Biedenharn          http://agileconsultingllc.com
> > > R...-xa9cJyRlE0mWcWVYNo9pwxS2lgjeYSpx@public.gmane.org