Partially visible text for ipywidgets

Question

I have made a selection_range_slider in jupyter notebook using ipywidgets, the only issue is that we can't see the end of the second date. What modification should I make to make this visible? (see picture below)

Here is my code:

    start_date = datetime(2019, 4, 24)
    end_date = date.today()

    dates = pd.date_range(start_date, end_date, freq='D')

    options = [(date.strftime(' %d %b %Y '), date) for date in dates]
    index = (0, len(options)-1)

    selection_range_slider = widgets.SelectionRangeSlider(
        options=options,
        index=index,
        description='Dates',
        continuous_update=False,
        orientation='horizontal',
        layout={'width': '800px'},
        placeholder='Type something'
     )

    selection_range_slider.observe(change_scatter_chart, names="value")
    selection_range_slider

    widgets.VBox([selection_range_slider, fig])

@Godjenka, itepifano wisely requested you add the code to the question. Use a code block to add it to your post by editing it. The comment you added has no indenting apparent and has all the lines as run on. — Wayne, May 30 '22 at 15:57
For an alternative solution where you make a separate HTML text item showing the current, selection see the first option listed [here](https://stackoverflow.com/a/72218747/8508004). You may want to read that entire thread at [the final link](https://github.com/jupyter-widgets/ipywidgets/issues/2855#issuecomment-966747483) as it is pertinent to your question and maybe an alternative there covers what you need in a simpler way. — Wayne, May 30 '22 at 16:06

score 0 · Answer 1 · answered Jun 21 '22 at 22:08

1st option: Modify layout={'width' : '800px'} into layout={'width' : '700px'}

or

2nd option: put this at the beginning of your script

from IPython.display import display, HTML
display(HTML(data="""<style>div#notebook-container{ width: 100%; }</style>"""))

Partially visible text for ipywidgets

1 Answers1