Topic: Issue with Material Select within Vertical Stepper

xchanger pro asked 5 years ago


Material select's dropdown losses inline alignment when embeded within vertical stepper. Selects are affeceted by steppers' css. My first guess would be simple change from ".stepper-vertical li" to ".stepper-verical > li", which I'll be giving a try in a sec. Did anyone encounter similar issues? bests, pp.

xchanger pro answered 5 years ago


Hi, thx for reply. The thing is I didn't set it, it's inherited from Vertical Stepper component. I followed my idea from last post and replace “.stepper-vertical li” to “.stepper-verical > li” within mdb.min.css. It works as it supposed to ;) bests, pp.

xardonik free answered 5 years ago


Look, you have set flex-direction:column and it's mean children of your tag are oriented vertical. Maybe you can add div inside your li and later move your img and span to div. Probably you will nedd set to div display:flex; flex-direction:row; This is examples of how it flexbox works. Very powerful feature, please check this: https://codepen.io/osublake/pen/dMLQJr https://mdbootstrap.com/css/flexbox/

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags