Posts

Showing posts with the label tailwindcss

Tailwind / Css flexbox: limit height of child scrollable element based on small sibling

Image
Presenting a css approach to crafting a vertically scrollable list, this method leverages the power of flexbox to seamlessly adapt to the space allocated by a neighboring element. Both a  pure CSS  rendition and a  Tailwind CSS  variation are at your disposal. Use Case: Our specific requirement called for the creation of a container featuring two distinct columns: The left-hand column needed to accommodate a chart area that could expand as needed. The right-hand column had to house a list that scrolled vertically and utilized the entire available height. Requirements: Our key requirements were as follows: The chart area should have the capacity to hold an canvas element. The scrollable list should adapt its height based on the chart area’s dimensions, displaying as many items as possible within that space while providing vertical scrolling when necessary. Challenges: We encountered a challenge when applying flexbox alongside the overflow: scroll property and renderin...

django inline formset id: * this field is required.

By default  django-crispy-forms   renders the layout specified if it exists strictly. Sometimes you might be interested in rendering all form’s hidden fields no matter if they are mentioned or not. So we get an error like: formset id: * this field is required. We can set render_hidden_fields an attribute of Form Helper to True. from crispy_forms.helper import FormHelper class FormHelperWithHiddenFields ( FormHelper ): form_tag = False field_class = "mb-4" # Required to render hidden fields to prevent >id: this field is required. render_hidden_fields = True Useful when trying to render forms with layouts as part of a formset with hidden primary key fields.