DropdownButtonFormField selected item being clipped off

Question

Within a DropdownButtonFormField with the following selectedItemBuilder:

selectedItemBuilder: (context) {
    return widget.vatRates.vatRateList!.map<Widget>((item) {
        return Padding(
            padding: const EdgeInsets.only(top: 12.0),
            child: Text(
                item.name!,
                style: const TextStyle(fontSize: Sizes.p12),
            ),
        );
    }).toList();
},

The selected items are clipped off. Tried contentPadding parameter inside decoration's InputDecoration.

Answer 1

Having a Stack with clipBehavior set to Clip.none alleviates this issue. Also used Positioned instead of using Padding:

selectedItemBuilder: (context) {
    return widget.vatRates.vatRateList!.map<Widget>((item) {
        return Stack(
            clipBehavior: Clip.none,
            children: [
                Positioned(
                  bottom: -6,
                  child: Text(
                    item.name!,
                    style: const TextStyle(fontSize: Sizes.p12),
                  ),
                )
            ],
        );
    }).toList();
}