Hi,
As you probably know, currently the column headers in contrib:Table are
rendered using a table. The reason is that the following behaviour is
required:
- the column title may be more than one line, as it it may be long and
may be wrapped by the browser
- the sorting icon needs to be always on right of the column title, even
if it wraps
An HTML table with two td cells satisfies those two criteria perfectly.
I have been trying to achieve the same effect with divs and CSS, but I
am failing.
In almost all cases the picture looks good, but once the browser width
becomes tight, the second div (the one with the image) is moved
underneath the first no matter what. I have tried 'float', 'clear: none'
'display: inline' and other CSS tricks, but none of them seem to resolve
this issue.
There is another matter: as far as I know, 'style' is of a higher
priority than generic CSS, and that places additional restrictions on
what can be done. The goal is to be able to control table columns using
CSS from outside the contrib:Table component.
At this point I am leaning towards keeping the 'table' structure in the
columns headers, albeit adding width=100% to ensure it is more easily
manipulated with an external CSS (moved left or right, for example). If
you happen to have a suggestion for resolving the above issues and
making it easier than currently to apply CSS, please do let me know.
-mb
P.S. I am not a web designer, so some of the issues described may be
quite easy to solve with the right knowledge.
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
