Arelle / ixbrl-viewer

The Arelle iXBRL Viewer allows Inline XBRL (or iXBRL) reports to be viewed interactively in a web browser. The viewer allows users to access the tagged XBRL data embedded in an iXBRL report.
Other
104 stars 60 forks source link

Highlighting of absolutely positioned children of ix:nonNumeric elements #139

Closed Nachtinho closed 2 years ago

Nachtinho commented 4 years ago

Hi,

tagged textblock can not be highlighted in iXBLR previewer.

I have created two examples: V1.zip uses css classes. Highlighting doesn't work. If I remove the property "class='...' ", it works

V2.zip has the same document but don't uss css classes.

If I remove the property position:absolute; in css, it works as expected.

Can someone help ?

Kind regards, Nachtinho

paulwarren-wk commented 4 years ago

OK, to clarify, the issue is not the use of class attributes, but specifying position: absolute on an element within an <ix:nonNumeric> tag. This is an issue whether it is done using style attributes or CSS classes.

The viewer doesn't currently support this, as it wraps the <ix:nonNumeric> tag with an additional element, and applies highlighting/borders to that. Specifying position: absolute takes the enclosed element out of the flow of HTML elements, and so the rendered wrapper element is not actually wrapping anything.

This can be fixed within the document by placing the <ix:nonNumeric> element within the absolutely positioned element, and using <ix:continuation> if the tag spans multiple such elements.

I suspect this will be very hard to fix reliably within the viewer, as it would require detecting an separately such absolutely positioned elements.

Nachtinho commented 4 years ago

yes, it seems to be an issue in Preview (javascript) and it is a valid HTML. The workaround will blow up the HTML unnecessary. From my perspective it should be fixed in javascript, right ?

beltistos87 commented 3 years ago

Hi, first of all I would like to thanks everybody for the subject in this topic, because it was very useful to find at least a workaround. I was dealing with the same issue and using position:relative in the html code let to obtain highlight in the iXBRL preview. Unfortunately, introducing the relative position may affect the correct view of the page created by the html, i.e. words in relative position move around and the readibilty of the text is reduced. So I am forced to assign the position:relative only to a word or two in order to minimize the loss of readibility. Do you find any new suggestion to solve this issue?

Kind regards, Andrea

Nachtinho commented 3 years ago

Hi,

Issue https://github.com/Workiva/ixbrl-viewer/issues/107 has been fixed. But still no progress on this...

Regards,

paulwarren-wk commented 3 years ago

Edited the summary to more accurately describe the issue.

Screenshot: image

The reliance on absolutely position div elements to layout normal paragraphs of text seems very undesirable. As well as preventing correct highlighting of the iXBRL tags, it also interferes text selection behaviour in the browser.