You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by Apache Wiki <wi...@apache.org> on 2006/04/20 13:42:28 UTC
[Myfaces Wiki] Update of "css component ids" by MatthiasWessendorf
Dear Wiki user,
You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.
The following page has been changed by MatthiasWessendorf:
http://wiki.apache.org/myfaces/css_component_ids
New page:
Since JSF's NamingContainer's cause rendered ids like "foo:bar", here is described howto work around for CSS.
You just need to use a backslash to escape the colon
{{{
<style>
div#foo { background-color:red}
div#foo\:bar { background-color:green}
</style>
}}}
Rendered markup by a component
{{{
<div id="foo">Foo</div>
<div id="foo:bar">Foo:Bar</div>
}}}
Note, that JSF is not incompatible to CSS
BTW. the standard naming container components are:
* h:form
* f:subview
* h:dataTable
Re: [Myfaces Wiki] Update of "css component ids" by MatthiasWessendorf
Posted by Martin Marinschek <ma...@gmail.com>.
Yes, of course, style classes are an option.
But believe it or not, you can't use style classes everywhere. There
are CSS constructs, where it's just not possible to use classes, eg.
when you need to do subselects.
If you add to this the necessity to work with external designers,
you're out of luck.
regards,
Martin
On 4/20/06, Jacob Hookom <ja...@hookom.net> wrote:
> One thing you could also promote is to stick to classes for styling--
> the 37Signals guys do this, leaving identifiers up to server-side code
> and promoting re-use of content.
>
> Matthias Wessendorf wrote:
> > damn,
> >
> > just tested. Firefox shows the div as green, but IE not.
> >
> > thanks for pointing it out, I just updated the wiki.
> >
> > On 4/20/06, Martin Marinschek <ma...@gmail.com> wrote:
> >
> >> That only works for Firefox, though. Not for IE, afaik.
> >>
> >> regards,
> >>
> >> Martin
> >>
> >> On 4/20/06, Apache Wiki <wi...@apache.org> wrote:
> >>
> >>> Dear Wiki user,
> >>>
> >>> You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.
> >>>
> >>> The following page has been changed by MatthiasWessendorf:
> >>> http://wiki.apache.org/myfaces/css_component_ids
> >>>
> >>> New page:
> >>> Since JSF's NamingContainer's cause rendered ids like "foo:bar", here is described howto work around for CSS.
> >>>
> >>> You just need to use a backslash to escape the colon
> >>> {{{
> >>> <style>
> >>> div#foo { background-color:red}
> >>> div#foo\:bar { background-color:green}
> >>> </style>
> >>> }}}
> >>>
> >>> Rendered markup by a component
> >>> {{{
> >>> <div id="foo">Foo</div>
> >>> <div id="foo:bar">Foo:Bar</div>
> >>> }}}
> >>>
> >>> Note, that JSF is not incompatible to CSS
> >>>
> >>> BTW. the standard naming container components are:
> >>> * h:form
> >>> * f:subview
> >>> * h:dataTable
> >>>
> >>>
> >> --
> >>
> >> http://www.irian.at
> >>
> >> Your JSF powerhouse -
> >> JSF Consulting, Development and
> >> Courses in English and German
> >>
> >> Professional Support for Apache MyFaces
> >>
> >>
> >
> >
> > --
> > Matthias Wessendorf
> > Aechterhoek 18
> > 48282 Emsdetten
> > http://jroller.com/page/mwessendorf
> > mwessendorf-at-gmail-dot-com
> >
> >
>
>
> --
> --------------------------
> Sent from my FrankenBerry Wireless Handheld
>
>
--
http://www.irian.at
Your JSF powerhouse -
JSF Consulting, Development and
Courses in English and German
Professional Support for Apache MyFaces
Re: [Myfaces Wiki] Update of "css component ids" by MatthiasWessendorf
Posted by Jacob Hookom <ja...@hookom.net>.
One thing you could also promote is to stick to classes for styling--
the 37Signals guys do this, leaving identifiers up to server-side code
and promoting re-use of content.
Matthias Wessendorf wrote:
> damn,
>
> just tested. Firefox shows the div as green, but IE not.
>
> thanks for pointing it out, I just updated the wiki.
>
> On 4/20/06, Martin Marinschek <ma...@gmail.com> wrote:
>
>> That only works for Firefox, though. Not for IE, afaik.
>>
>> regards,
>>
>> Martin
>>
>> On 4/20/06, Apache Wiki <wi...@apache.org> wrote:
>>
>>> Dear Wiki user,
>>>
>>> You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.
>>>
>>> The following page has been changed by MatthiasWessendorf:
>>> http://wiki.apache.org/myfaces/css_component_ids
>>>
>>> New page:
>>> Since JSF's NamingContainer's cause rendered ids like "foo:bar", here is described howto work around for CSS.
>>>
>>> You just need to use a backslash to escape the colon
>>> {{{
>>> <style>
>>> div#foo { background-color:red}
>>> div#foo\:bar { background-color:green}
>>> </style>
>>> }}}
>>>
>>> Rendered markup by a component
>>> {{{
>>> <div id="foo">Foo</div>
>>> <div id="foo:bar">Foo:Bar</div>
>>> }}}
>>>
>>> Note, that JSF is not incompatible to CSS
>>>
>>> BTW. the standard naming container components are:
>>> * h:form
>>> * f:subview
>>> * h:dataTable
>>>
>>>
>> --
>>
>> http://www.irian.at
>>
>> Your JSF powerhouse -
>> JSF Consulting, Development and
>> Courses in English and German
>>
>> Professional Support for Apache MyFaces
>>
>>
>
>
> --
> Matthias Wessendorf
> Aechterhoek 18
> 48282 Emsdetten
> http://jroller.com/page/mwessendorf
> mwessendorf-at-gmail-dot-com
>
>
--
--------------------------
Sent from my FrankenBerry Wireless Handheld
Re: [Myfaces Wiki] Update of "css component ids" by MatthiasWessendorf
Posted by Matthias Wessendorf <ma...@apache.org>.
damn,
just tested. Firefox shows the div as green, but IE not.
thanks for pointing it out, I just updated the wiki.
On 4/20/06, Martin Marinschek <ma...@gmail.com> wrote:
> That only works for Firefox, though. Not for IE, afaik.
>
> regards,
>
> Martin
>
> On 4/20/06, Apache Wiki <wi...@apache.org> wrote:
> > Dear Wiki user,
> >
> > You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.
> >
> > The following page has been changed by MatthiasWessendorf:
> > http://wiki.apache.org/myfaces/css_component_ids
> >
> > New page:
> > Since JSF's NamingContainer's cause rendered ids like "foo:bar", here is described howto work around for CSS.
> >
> > You just need to use a backslash to escape the colon
> > {{{
> > <style>
> > div#foo { background-color:red}
> > div#foo\:bar { background-color:green}
> > </style>
> > }}}
> >
> > Rendered markup by a component
> > {{{
> > <div id="foo">Foo</div>
> > <div id="foo:bar">Foo:Bar</div>
> > }}}
> >
> > Note, that JSF is not incompatible to CSS
> >
> > BTW. the standard naming container components are:
> > * h:form
> > * f:subview
> > * h:dataTable
> >
>
>
> --
>
> http://www.irian.at
>
> Your JSF powerhouse -
> JSF Consulting, Development and
> Courses in English and German
>
> Professional Support for Apache MyFaces
>
--
Matthias Wessendorf
Aechterhoek 18
48282 Emsdetten
http://jroller.com/page/mwessendorf
mwessendorf-at-gmail-dot-com
Re: [Myfaces Wiki] Update of "css component ids" by MatthiasWessendorf
Posted by Martin Marinschek <ma...@gmail.com>.
That only works for Firefox, though. Not for IE, afaik.
regards,
Martin
On 4/20/06, Apache Wiki <wi...@apache.org> wrote:
> Dear Wiki user,
>
> You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.
>
> The following page has been changed by MatthiasWessendorf:
> http://wiki.apache.org/myfaces/css_component_ids
>
> New page:
> Since JSF's NamingContainer's cause rendered ids like "foo:bar", here is described howto work around for CSS.
>
> You just need to use a backslash to escape the colon
> {{{
> <style>
> div#foo { background-color:red}
> div#foo\:bar { background-color:green}
> </style>
> }}}
>
> Rendered markup by a component
> {{{
> <div id="foo">Foo</div>
> <div id="foo:bar">Foo:Bar</div>
> }}}
>
> Note, that JSF is not incompatible to CSS
>
> BTW. the standard naming container components are:
> * h:form
> * f:subview
> * h:dataTable
>
--
http://www.irian.at
Your JSF powerhouse -
JSF Consulting, Development and
Courses in English and German
Professional Support for Apache MyFaces