Tuesday, May 29, 2012

ADF Bug or Feature? Non-Breaking Space outside required icon style

Tested with JDeveloper:

In this post I am going to describe a limitation I hit while skinning the alignment and positioning of the required Icon.

The desired end result should be as following


To get there we have an ADF weapon called skinning. So we create a skin css file and style the following selectors


Having done that we start the application and will notice that in case of required fields the result is still not really what expected:


OK, since the required icon container (span) can be referenced by css selector we should be able to move that required icon on the left side. This can be done by the following css


Refreshing the page in the browser the form layout looks close to the target result


Except the blank before Lastname. Did you notice? Having those blanks in forms with more fields the overall design looks pretty poor / messed up! So where does the blank comes from?

Inspecting through Firebug (1.9.0), everything seems OK. I cannot see any pointer for the blank.


BUT, looking on the raw HTML code you will see a non-breaking space in case the required="true" or showRequired="true" is set on the components


This nbsp is really annoying since  it is not possible to select this one by CSS. At least I have not find a way to remove that by CSS.

So is it a bug or a feature? I would say it is a bug since it is not easy (or even not possible) to influence the position of the nbsp. It is not enclosed e.g. in the span for the required icon style and therefore not selectabl by CSS. Why isn't it generated like


Everything would be fine.


In order to get the desired alignment


I wrote a ServletFilter, wrapped the HTTPServletResponse to buffer the response, process the filter chain and filter the buffered response like

public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException,
ServletException {

HttpResponseCharBufferWrapper wrapper =
new HttpResponseCharBufferWrapper((HttpServletResponse)response);

chain.doFilter(request, wrapper);

String filteredResult = wrapper.toString();
filteredResult = filteredResult.replaceAll("> ", ">");


(Don't forget to register the filter in web.xml)

The nice thing about that workaround is, that you can implement what ever content filter rules you want/need. On the con side there is for sure more memory consumption.




I know that the provided workaround is really dirty and I personally do not like it! I will file an ER/SR at My Oracle Support and the ADF EMG Defect tracker (http://java.net/projects/adfemg)

If anyone knows of a cleaner and better workaround, let me know. Maybe some niffty CSS Hack (I have not found yet) could do the trick. (:after? content?) Any comments are welcome.


(Jdev workspace)



  1. This comment has been removed by a blog administrator.

  2. I used filter but it's not working properly when i have set usesUpload=true on form. Did you find any other way to eliminate non-breaking space ? I have done it in JS but it's slow in IE7, i am looking for other solution.