Columns Don't Auto Size Bigger

web
mobile

Topic: Columns Don't Auto Size Bigger

Philip Keiter asked 2 years ago

Using 'auto' correctly auto sizes smaller, as you documented. But using a plain <column> with no parameters does not auto size bigger to fill available space in the row, as it would in bootstrap, and as your docs claim it does.

Jakub Strebeyko staff answered 2 years ago

Hi there Philip,

It must have something to do with recent changes in <column> component and the fact they temporarily do not fall back to the .col class in case of lack of props. While it is being fixed, it is fairly easy to deal with the issue instanlty, at your end. Adding it manually should solve the issue for a single column, but to have it all the way it was please edit className() at src/components/Col.vue, line 47. Make it start with 'col', like so:

data() {
    return {
      className: classNames(
        'col',
        this.col ? 'col-' + this.col : '',
        this.sm ? 'col-sm-' + this.sm : '',
        this.md ? 'col-md-' + this.md : '',
        ...

Depending on the use case, you might need to rebuild the app (yarn build). Thanks for taking time and letting us know!

With Best Regards,
Kuba


I think it would be cleaner this way, so you don't end up with multiple col classes when just one will suffice: https://github.com/mdbootstrap/Vue-Bootstrap-with-Material-Design/pull/17

Bartłomiej Malanowski staff pro premium commented 2 years ago

Thank you for the PR. We'll take a look at this ;)

Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: Vue
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No