✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Problem with html.Iframe

I am trying to load and print all the console output into Dash. Tried Markdown first but not working well. Then I used html.Iframe. The place where I got stuck is it is not showing the white-space of the tables in the text file. For example below:
image
image

Here is my code:

the ‘white-space’:’ pre-wrap’ seems not working to do the job. I am curious how I can fix this or if there is a better way to show this txt. Thanks

import dash
import dash_core_components as dcc
import dash_html_components as html

text_markdown = “”
f = open(‘stdout.txt’)
line = f.readline()
text_markdown = “”
while line:
text_markdown += “
”+line
line = f.readline()
f.close()

app = dash.Dash(name)

app.layout = html.Div([
html.Div([

dcc.Markdown(text_markdown)

                       html.Iframe(

                               srcDoc = text_markdown,
                               style={'border': 'none', 'width': '100%', 'height': 600,'white-space':' pre-wrap'},)
            ])

])

if name == ‘main’:
app.run_server(debug=False)

Here is a sample text file:

Processing 3/9 : AC857-1_LQC_IRM.las
The file has these tracks: [‘DEN’, ‘DT’, ‘DT_SHEAR’, ‘GR’, ‘NET_SAND_LRP’, ‘NEU’, ‘POR_LRP’, ‘POR_SAND_LRP’, ‘RES_DEP’, ‘SWT_LRP’, ‘SWT_SAND_LRP’]
Well Log Detection Mode:
| Log Name | Value Looks | Fuzzy Search |
|------------------±--------------±---------------|
| [‘DEN’] | [‘DEN’] | [‘DEN’] |
| [‘DT’] | [‘DTC’] | [‘DTC’] |
| [‘DT_SHEAR’] | [‘DTS’] | [‘DTS’] |
| [‘GR’] | [‘GR’] | [‘GR’] |
| [‘NET_SAND_LRP’] | [‘POR’] | [‘NTG’] |
| [‘NEU’] | [‘POR’] | [‘NEU’] |
| [‘POR_LRP’] | [‘POR’] | [‘POR’] |
| [‘POR_SAND_LRP’] | [‘POR’] | [‘POR’] |
| [‘RES_DEP’] | [‘RT’] | [‘RT’] |
| [‘SWT_LRP’] | [‘FRAC’] | [‘SW’] |
| [‘SWT_SAND_LRP’] | [‘FRAC’] | [‘SW’] |

Problem was solved by switching to dcc.Textarea